16

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

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

现在，第一和第二个工作。三是问题。
我知道event.startPropagation不存在，但我想要这样的东西。有什么提示吗？

4

3 回答 3

11

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

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

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

编辑

根据您的评论，我认为您正在寻找类似的东西：

$.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);
                    });
                });
            });
        }
    });
};

此原型允许您绑定一个“高级处理程序”，该处理程序包含一个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
});

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

于 2013-07-17T09:26:31.143 回答
2

不要一开始就停止传播。

测试是否my function符合您的要求，然后决定您是否要停止传播。

于 2013-07-17T09:10:24.467 回答
0

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

更新：

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

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

于 2013-07-17T09:12:46.783 回答