js禁止事件触发,js关闭事件

js禁止事件触发,js关闭事件,JS传播事件、取消事件默认行为、阻止事件传播详解

本文主要介绍JS传播事件,取消事件的默认行为,防止事件的传播。它通过事件处理程序返回值的调用顺序来说明详细的过程。有需要的朋友可以参考一下。

1.事件处理程序的返回值

通常,false的返回值告诉浏览器不要执行与该事件相关的默认操作。比如表单提交按钮的onclick事件处理程序可以通过返回false来阻止浏览器提交表单,A标签的onclick事件处理程序可以通过返回false来阻止跳转到href页面。同样,如果用户输入了不适当的字符,输入域上的onkeypress事件处理程序可以通过返回false来过滤键盘输入。

事件处理程序的返回值仅对通过属性注册的处理程序有意义。

2.调用顺序

文档或其他对象可以为指定的事件类型注册多个事件处理程序。当适当的事件发生时,浏览器必须根据以下规则调用所有事件处理程序:

通过设置对象属性或HTML属性注册的处理程序总是首先被调用。

用addEventListener()注册的处理程序按照它们注册的顺序被调用。

用attachEvent()注册的处理程序可以按任何顺序调用,所以代码不应该依赖于调用顺序。

3.事件传播

在调用在目标元素上注册的事件处理程序后,大多数事件将“冒泡”到DOM的根。调用目标的父元素的事件处理程序,然后调用在目标的祖父元素上注册的事件处理程序。这一直到文档对象,最后到窗口对象。

大多数发生在文档元素上的事件都会冒泡,除了焦点、模糊和滚动事件。文档元素的load事件将冒泡,但它将在文档对象上停止冒泡,而不会传播到窗口对象。Window对象的load事件只有在整个文档被加载时才会被触发。

4.取消事件默认行为、阻止事件传播

在支持addEventListener()的浏览器中,可以通过调用事件对象的preventDefault()方法来取消事件的默认操作。在IE9之前的IE中,将事件对象的returnValue属性设置为false也可以达到同样的效果。下面的代码结合了三种取消事件的技术:

函数cancelHandler(事件){

var event=event | | window.event//与IE兼容

//取消与事件相关的默认行为

If(event.preventDefault) //标准技术

event . prevent default();

If(event.returnValue) //与IE9之前的IE兼容

event.returnValue=false

返回false//用于使用对象属性处理注册的处理程序

}

取消与事件相关的默认操作只是事件取消的一种,我们还可以取消事件传播。在支持addEventListener()的浏览器中,可以调用event对象的stopPropagation()方法来防止事件传播。如果在同一个对象上定义了其他处理程序,仍将调用其余的处理程序,但在调用stopPropagation()后,将不会调用任何其他对象上的事件处理程序。

IE9之前的IE不支持stopPropagation()方法,而是将事件对象的cancelBubble属性设置为true,防止事件进一步扩散。

好了,这就是边肖为大家整理的所有内容。希望对大家有帮助~

js禁止事件触发,js关闭事件