jquery - 如何在 jQuery 中从第一个处理程序阻止其他事件处理程序

Question

如果将两个或多个事件处理程序附加到 HTML 元素，它们将依次执行。但是，如果您想根据第一个处理程序中检查的条件停止后续事件处理程序，那么您应该做什么？

例如:

<div id='target'>
</div>

<p id='result'>
</p>

如果第一个处理程序被取消，我想取消第二个处理程序。

$(function() {
    var target = $('#target'),
        result = $('#result');
    target.click(function(e) {
        result.append('first handler<br />');
        // Here I want to cancel all subsequent event handlers
    });
    target.click(function(e) {
        result.append('second handler<br />');
    });
});

你可以看到 fiddle here .

PS:我知道 e.preventDefault() 会阻止 HTML 元素的默认操作(例如，阻止因单击链接而发送 HTTP GET 请求)，并且 e.preventPropagation() 导致事件传播到 DOM 树中的父元素。我还知道可以使用中间变量，在第一个处理程序中将其设置为 true，然后在后续处理程序中检查它。但我想看看是否有更简洁、更复杂的解决方案来解决这个问题。

Answer 1

参见event.stopImmediatePropagation() - http://api.jquery.com/event.stopImmediatePropagation/

根据 jQuery API 文档，此方法:

Keeps the rest of the handlers from being executed and prevents the event from bubbling up the DOM tree.