如何阻止事件回调自身触发？
如何阻止事件回调自身触发？
提问于 2016-01-24 16:42:25
我编写了一个Javascript事件监听器来捕获捕获阶段的点击，执行一个操作，然后重复单击触发任何通常应该发生的代码。
var obj=document.getElementById('button');
obj.addEventListener('click', function(event){
event.stopPropagation();
console.log('Performing operation here');
otherOperation('ajax', function(){
obj.click();
});
}, true);显然，这会创建一个无限的操作循环。我认为这是最好的方法，因为操作需要时间延迟，在得到另一个回调之前，我不能继续事件传播。
是否有一种方法来检测单击是由我自己的回调函数执行的，从而忽略它？
我有一个理论可以在操作完成后删除事件侦听器，但是在某些情况下需要再次添加它，这就产生了大量的代码。
回答 3
Stack Overflow用户
回答已采纳
发布于 2016-01-24 16:49:37
在大多数浏览器上运行的一个黑客解决方案是复制按钮本身，隐藏或删除原始按钮，向新浏览器添加单击处理程序，并在必要时对旧浏览器调用button.click()。
Stack Overflow用户
发布于 2016-01-24 16:47:27
在现代浏览器(不是IE或Safari)中，使用event.isTrusted时，只有当事件由用户操作触发时，wich才是正确的
var obj=document.getElementById('button');
obj.addEventListener('click', function(event){
if ( event.isTrusted ) {
event.stopPropagation();
console.log('Performing operation here');
otherOperation('ajax', function(){
obj.click();
});
} else {
// click triggered by javascript
}
}, true);如果您必须支持Safari和IE9及以上版本，则可以使用自定义参数分派事件。
var obj = document.getElementById('button');
obj.addEventListener('click', function(event) {
if ('trusted' in event && event.trusted === false) {
// click triggered by javascript
} else {
event.stopPropagation();
console.log('Performing operation here');
otherOperation('ajax', function() {
var ev = new MouseEvent('click', { // create event
'view': window,
'bubbles': true,
'cancelable': true
});
ev.trusted = false; // add custom data
self.dispatchEvent(ev); // trigger event
});
}
}, true);jQuery事件添加了一些类似的功能，您只需检查originalEvent是否触发了事件。
Stack Overflow用户
发布于 2016-01-24 17:49:41
如果我正确地理解了这个问题，那就有两个操作。1.“其他操作”以异步调用2的形式触发。正常的手术。
正常操作可以作为按钮侦听器内部的回调触发，也可以通过任何其他方式单独调用。下面的解决方案如何？
var obj=document.getElementById('button');
obj.addEventListener('click', function(event){
event.stopPropagation();
console.log('Performing operation here');
otherOperation('ajax', function(){
normalOperation();
});
}, true);
function normalOperation() {
//normal operation to be happened for click
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/34978446
复制相关文章
相似问题
腾讯云开发者
