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
stopPropagation and startPropagation
提问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.startPropagation
doesn'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 next
function 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
});
回答by Quentin
Don't stop propagation in the first place.
首先不要停止传播。
Test if my function
does 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()
函数。