javaScript中的事件对象event

Posted 2020-09-20 liguangsunls

事件对象event，每当一个事件被触发的时候，就会随之产恒一个事件对象event，该对象中主要包括了关于该事件的基本属性，事件类型type（click、dbclick等值）、目标元素target（我的理解是事件源对象，即触发该事件的dom元素）等，以及一些与该事件相关的方法。取消事件默认行为preventDefault()、组织事件继续冒泡或捕获stopPropagation()等等，这里我仅仅列举了，项目中我用到的属性和方法。

既然事件被触发。就随之产生了一个event对象。笔者在IE中測试了。不须要通过赋值就可以使用，也许低版本号的须要吧，火狐浏览器是须要对其进行赋值的，在这里我认为须要养成一个习惯。多谢一行代码呗。每次在事件处理程序中使用event对象，都通过赋值的方式去使用：

var event = event||window.event;

事实上，默认參数数组中第一元素就是event对象，也就是说，能够用数组元素赋值

var event = arguments[0];

type属性。应该是最easy理解的，事件类型。单击click，双击dbclick等等

target属性，触发事件的dom元素对象。我看到网上说target是火狐浏览器。srcElement是IE中的，可是我測试的结果是。在IE11中两个都能够使用了，一样的效果。可是火狐中仅仅能使用target属性，浏览器之间的实现方式能不能有个通用的标准呢，兼容性非常纠结呢，所以和event对象的获取一样，建议是通过赋值的方式去获取触发事件的dom对象：

var target = event.target||event.srcElement;

preventDefault()方法是用来取消默认事件行为的，比方超链接，点击超链接，会依据href属性，跳到还有一个页面。之前在项目中。就遇到非常多须要取消超链接的默认点击行为，在点击事件处理程序中。取消默认的事件行为，能够例如以下操作：

if(event.preventDefault){//推断该函数是否存在
     event.preventDefault;
}else{
     returnValue = false;
}

这样也实现了取消超链接的默认行为，事实上在项目中，还看到别的同事使用的别的方式，也取消是默认的点击行为

<a href="javascript:void(0);">也行</a>

stopPropagation()方法直接就取消事件的继续冒泡或者捕获了，这个非常有用的，假设父元素和子元素都绑定了某个相同类型的事件，比方都绑定了click事件。如今用户触发了一个事件，事件在捕获阶段被触发，针对父元素，则会继续向下捕获。进而触发子元素的事件。针对子元素。在冒泡阶段被触发，也相同由于冒泡行为，会触发父元素的事件。因此往往须要取消这样的无意的触发。

if(event.stopPropagation){//推断是否存在
      event.stopPropagation();
}else{
      event.cancleBubble = true;
}

2014年9月30日22:04:18

兴许项目中。假设还是用到了别的相关操作，我在继续补充