使用 .trigger() 触发特定点击事件但抑制所有其他点击事件的方法
Method for triggering certain click event using .trigger() but suppressing all others
我的情况是,我正在尝试使用 jquery .trigger() 方法触发单个事件。但是我触发的元素有多个点击事件侦听器。
实际上从源代码中找到这些侦听器是什么以及它们触发了什么可能是不可行的,因为它包含在网站的主 JS 文件中,并且全部缩小并且几乎不可读。
目前我知道单击元素时会执行某种 ajax 调用并将更多数据加载到页面的 DOM 中(这是我想要触发的),但是它还显示一个叠加层(这是我想暂时抑制的)。
因为它只是一个覆盖层,所以我可以采取一些解决方法.. 在点击后直接在其上使用 display:none 等。但是,如果我能以某种方式抑制此元素上的所有点击事件,它会更加优雅除了所需的事件。
如果这真的可行,有什么想法吗?如果是这样,我会怎么做?
您需要在事件链的顶端注册您自己的事件。并在你的事件中取消事件链。这是编写自定义 jquery 扩展的解决方案。
$.fn.bindFirst = function (which, handler) {
var $elm = $(this);
$elm.unbind(which, handler);
$elm.bind(which, handler);
var events = $._data($elm[0]).events;
var registered = events[which];
registered.unshift(registered.pop());
events[which] = registered;
}
$("#elm").bindFirst("click", function(e) {
// edit: seems like preventing event does not work
// But your event triggers first anyway.
e.preventDefault();
e.stopPropagation();
});
参考:
https://gist.github.com/infostreams/6540654
编辑:
https://jsfiddle.net/8nb9obc0/2/
我制作了一个 jsFiddle,似乎事件预防在此示例中不起作用。可能还有其他解决方案。
我的情况是,我正在尝试使用 jquery .trigger() 方法触发单个事件。但是我触发的元素有多个点击事件侦听器。
实际上从源代码中找到这些侦听器是什么以及它们触发了什么可能是不可行的,因为它包含在网站的主 JS 文件中,并且全部缩小并且几乎不可读。
目前我知道单击元素时会执行某种 ajax 调用并将更多数据加载到页面的 DOM 中(这是我想要触发的),但是它还显示一个叠加层(这是我想暂时抑制的)。
因为它只是一个覆盖层,所以我可以采取一些解决方法.. 在点击后直接在其上使用 display:none 等。但是,如果我能以某种方式抑制此元素上的所有点击事件,它会更加优雅除了所需的事件。
如果这真的可行,有什么想法吗?如果是这样,我会怎么做?
您需要在事件链的顶端注册您自己的事件。并在你的事件中取消事件链。这是编写自定义 jquery 扩展的解决方案。
$.fn.bindFirst = function (which, handler) {
var $elm = $(this);
$elm.unbind(which, handler);
$elm.bind(which, handler);
var events = $._data($elm[0]).events;
var registered = events[which];
registered.unshift(registered.pop());
events[which] = registered;
}
$("#elm").bindFirst("click", function(e) {
// edit: seems like preventing event does not work
// But your event triggers first anyway.
e.preventDefault();
e.stopPropagation();
});
参考: https://gist.github.com/infostreams/6540654
编辑: https://jsfiddle.net/8nb9obc0/2/ 我制作了一个 jsFiddle,似乎事件预防在此示例中不起作用。可能还有其他解决方案。