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>
演示结果