event.stopImmediatePropagation()
返回:
event.stopImmediatePropagation()
描述:停止执行处理函数的剩余部分,防止事件沿着DOM树向上冒泡。
加入于: 1.3
event.stopImmediatePropagation()该方法不接受任何参数
除了保持元素上任何额外的处理函数继续执行,该方法还会通过潜在地调用event.stopPropagation()来中断冒泡。要想简单地阻止事件冒泡到祖先元素上,但是允许别的事件处理函数在同一个元素上执行,我们可以使用event.stopPropagation()来代替。
使用event.isImmediatePropagationStopped()以了解该方法是否已经(在该事件对象上)被调用。
其它说明
- 因为
.live()方法处理的事件一旦委托到document的上面,就不能再停止live事件的传播。类似地,通过delegate()方法处理的事件将传播到委托事件的元素上;当委托事件处理函数被调用时,应该已经执行了绑定在它下面的任何元素上的事件处理函数。然而,那些处理函数,可能通过调用event.stopPropagation()或者返回false来阻止触发委托的处理函数。
示例
阻止调用别的事件处理函数。
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>event.stopImmediatePropagation demo</title>
<style>
p {
height: 30px;
width: 150px;
background-color: #ccf;
}
div {
height: 30px;
width: 150px;
background-color: #cfc;
}
</style>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<p>paragraph</p>
<div>division</div>
<script>
$( "p" ).click(function( event ) {
event.stopImmediatePropagation();
});
$( "p" ).click(function( event ) {
// 将不能执行这个函数
$( this ).css( "background-color", "#f00" );
});
$( "div" ).click(function( event ) {
// 能执行这个函数
$( this ).css( "background-color", "#f00" );
});
</script>
</body>
</html>
演示结果