jQuery 停止传播和开始传播

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/17695567/
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-26 19:46:07  来源:igfitidea点击:

stopPropagation and startPropagation

javascriptjquerystoppropagation

提问by Piotr Wójcik

I want to make an additional click handler (client page, cant modify his js/html) and it should work like this in my script:

我想制作一个额外的点击处理程序(客户端页面,不能修改他的 js/html),它应该在我的脚本中像这样工作:

1) event.stopPropagation(pause client click propagation)
2) my function (do my function, when everything is done do next)
3) event.startPropagation(continue standard client action)

1)event.stopPropagation(暂停客户端点击传播)
2)我的功能(做我的功能,当一切都完成后做下一步)
3)event.startPropagation(继续标准的客户端操作)

Right now, the first and second work. The third is the problem.
I know event.startPropagationdoesn't exist, but I want something like that. Any hints?

现在,第一个和第二个工作。第三是问题。
我知道event.startPropagation不存在,但我想要这样的东西。任何提示?

回答by David Hellsing

You can re-trigger the same event object on the parent node, f.ex (jQuery). You will need to copy the event object first and pass it into the trigger in order to capture the same event properties in the bubble (f.ex e.pageX):

您可以在父节点 f.ex (jQuery) 上重新触发相同的事件对象。您需要先复制事件对象并将其传递到触发器中,以便在气泡 (f.ex e.pageX) 中捕获相同的事件属性:

var copy = $.extend(true, {}, e);
setTimeout(function() {
    $(copy.target.parentNode).trigger(copy);
},500);
e.stopPropagation();

Demo: http://jsfiddle.net/GKkth/

演示:http: //jsfiddle.net/GKkth/

EDIT

编辑

Based on your comment, I think you are looking for something like:

根据您的评论,我认为您正在寻找以下内容:

$.fn.bindFirst = function(type, handler) {
    return this.each(function() {
        var elm = this;
        var evs = $._data(this).events;
        if ( type in evs ) {
            var handlers = evs[type].map(function(ev) {
                return ev.handler;
            });
            $(elm).unbind(type).on(type, function(e) {
                handler.call(elm, e, function() {
                    handlers.forEach(function(fn) {
                        fn.call(elm);
                    });
                });
            });
        }
    });
};

This prototype allows you to bind a "premium handler" that holds a nextfunction that will execute all previous handlers to the same element when you want to. Use it like:

此原型允许您绑定一个“高级处理程序”,该处理程序包含一个next函数,该函数将在您需要时将所有先前的处理程序执行到同一元素。像这样使用它

$('button').click(function() {
    console.log('first');
}).click(function() {
    console.log('second');
}).bindFirst('click', function(e, next) {
    console.log('do something first');
    setTimeout(next, 1000); // holds the other handlers for 1sec
});

DEMO: http://jsfiddle.net/BGuU3/1/

演示:http: //jsfiddle.net/BGuU3/1/

回答by Quentin

Don't stop propagation in the first place.

首先不要停止传播。

Test if my functiondoes what you want it to do, and then decide if you are going to stop propagation or not.

测试它是否my function做了你想要它做的事情,然后决定你是否要停止传播。

回答by Dinesh

Add and remove the click handler if you want to enable/disable the click event respectively. Because event.stopPropagation()will stop the events from propagating up the dom tree.

如果要分别启用/禁用单击事件,请添加和删除单击处理程序。因为event.stopPropagation()会阻止事件向上传播 dom 树。

Update:

更新:

If you are using jQuery, use .trigger()function.

如果您使用 jQuery,请使用.trigger()函数。

http://api.jquery.com/trigger/

http://api.jquery.com/trigger/