javascript 事件对象

btn.onclick = function (event) {// event 就是事件对象var e = event || window.event; // window.event是兼容低版本IE的写法
}

event 常见属性

属性	用途
clientX	光标相对于该网页的水平位置
clientY	光标相对于该网页的垂直位置
type	事件的类型
target	该事件被传送到的对象
screenX	光标相对于该屏幕的水平位置
screenY	光标相对于该屏幕的垂直位置
pageX	光标相对于该网页的水平位置(IE6,7,8不适用)
pageY	光标相对于该网页的垂直位置(IE6,7,8不适用)
width	该窗口或框架的宽度
height	该窗口或框架的高度
data	返回拖拽对象的 URL 字符串

javascript 事件传递机制(冒泡)

js事件会从事件源(比如被点击的a标签)沿着DOM树一层层向上传递

注: 不是所有的事件都能冒泡,比如 : blur focus load unload

阻止冒泡

标准浏览器

event.stopPropagation();

event.cancelBubble = true;

兼容写法

function stopBubble(event) {// w3c标准if (event && event.stopPropagation) {event.stopPropagation()}else{   // IE浏览器event.cancelBubble = true; }
}

转载于:https://www.cnblogs.com/liaohui5/p/10581664.html

javascript 事件对象相关推荐

JavaScript事件对象
事件对象在触发DOM上的某个事件时,会产生一个事件对象event,这个对象中包含着所有与事件有关的信息. 兼容DOM的浏览器会将一个event传入到事件处理程序中.无论指定事件处理程序时使用什么方法 ...
JavaScript事件对象参数
1.概述事件触发后就会产生事件对象,与事件相关的信息都会存储在一个对象中:这个对象会以参数的形式传给事件处理函数,所以事件处理函数默认会有一个事件对象参数:想要使用这个事件对象只要给事件处理函数定义 ...
javascript --- 事件对象和事件类型
// 无论程序使用"DOM0级"规范还是"DOM2级"规范,都会在局部产生一个event对象, // 将其打印出来研究: <div id="di ...
javascript事件机制
javascript事件机制 ① javascript绑定事件的方式 http://blog.iderzheng.com/dom-javascript-event-binding-comparison ...
JavaScript 日期对象
我们今天就来学习一下JavaScript 日期对象,我们这个日期对象主要可以用于获取到当前时间,或者未来某天时间,还有时间戳计算. 下面就跟我来学习吧. 一.日期对象Date Date对象:这个Dat ...
JavaScript基础13-day15【DOM增删改、DOM添加删除记录、操作内联样式、获取元素的样式、DOM Element 对象、滚动条练习、事件对象、div跟随鼠标移动、事件冒泡】
学习地址: 谷粒学院--尚硅谷哔哩哔哩网站--尚硅谷最新版JavaScript基础全套教程完整版(140集实战教学,JS从入门到精通) JavaScript基础.高级学习笔记汇总表[尚硅谷最新版Ja ...
JavaScript：事件对象Event和冒泡
本文最初发表于博客园,并在GitHub上持续更新前端的系列文章.欢迎在GitHub上关注我,一起入门和进阶前端. 以下是正文. 绑定事件的两种方式我们在上一篇文章 DOM操作详解中已经讲过事件的概 ...
JavaScript --- 跨浏览器的事件对象
var EventUtil={addHandler: function(element, type, handler){ // 添加事件方法if (element.addEventListener){ ...
javascript事件与event对象的属性
javascript事件列表解说事件浏览器支持解说一般事件 onclick IE3.N2 鼠标点击时触发此事件 ondblclick IE4.N4 鼠标双击时触发此事件 onmousedown ...

javascript 事件对象

event 常见属性

javascript 事件传递机制(冒泡)

阻止冒泡

javascript 事件对象相关推荐

最新文章

热门文章