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

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/8118489/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-27 10:02:39  来源:igfitidea点击:

How to prevent other event handlers, from first handler, in jQuery

jqueryeventsevent-handling

提问by Saeed Neamati

If you attach two or more event handlers to an HTML element, they would be executed one after the other. However, if you want to stop the subsequent event handlers, based on a condition checked in the first handler, then what you should do?

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

For example:

例如:

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

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

I'd like to cancel the second handler, if the first handler is cancelled.

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

$(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 />');
    });
});

You can see the fiddle here.

你可以在这里看到小提琴。

PS: I know that e.preventDefault()prevents the default action of the HTML element (for example, preventing an HTTP GET request being sent because of the click on a link), and e.preventPropagation()causes the event from being propagated to its parent elements in the DOM tree. I also know that it's possible to use a middle variable, set it to true in first handler, and check it in subsequent handlers. But I want to see if there is a more neat, sophisticated solution to this problem or not.

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

回答by dcro

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

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

According to the jQuery API docs, this method:

根据 jQuery API 文档,此方法:

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

阻止其余的处理程序被执行,并防止事件在 DOM 树上冒泡。

回答by fncomp

The solution is browser specific. See dojo.stopEvent:

解决方案是特定于浏览器的。见dojo.stopEvent

dojo.stopEvent = function(/*Event*/ evt){
    // summary:
    //        prevents propagation and clobbers the default action of the
    //        passed event
    // evt: Event
    //        The event object. If omitted, window.event is used on IE.
    if(has("dom-addeventlistener") || (evt && evt.preventDefault)){
        evt.preventDefault();
        evt.stopPropagation();
    }else{
        evt = evt || window.event;
        evt.cancelBubble = true;
        on._preventDefault.call(evt);
    }
};

Updated fiddle: http://jsfiddle.net/pFp7P/1/

更新小提琴:http: //jsfiddle.net/pFp7P/1/