的addEventListener没有连接到正确的范围

我使用的是原生DOM的addEventListener事件，像这样：的addEventListener没有连接到正确的范围

const domElement = document.getElementById('ember464'); 
domElement.addEventListener('click', dosomething); 
this._listeners.push({target: domElement, type: 'click', callback: dosomething});

此注册的事件并将其存储在一个_listeners数组，以便以后可以清理。好消息是，这个事件确实附加到了DOM上，但是事件虽然目标显然只限于单个按钮，但处理程序似乎在检测到单击时触发！

我做错了什么？

p.s.这里是查看_listener数组的浏览器检查器......注意，突出显示“目标”确实只指向我试图定位的按钮。 AKA中，目标是DOM节点，而不是用于标识节点的选择器。

我现在看着在目标DOM元素调试器，我看到以下内容：

对于任何人有足够的勇气，这里有一个代码的工作演示。

https://ui-animate.firebaseapp.com/

完整的源代码是在这里：link

来源

2016-04-03 ken

您的代码看起来不错，我测试了它（Chrome）和它应该的工作。转到调试器工具，检查ember464元素，选择“事件监听器”，并选中祖先复选框，看看它是否有帮助。 –

@SideriteZackwehdex感谢您的建议;我添加了我附加的事件侦听器的屏幕截图，并且它在Window级别附加，即使我99％确定我已经捕获了它的正确范围。 :( – ken

好了，问题是在第二个按钮是由“点击”事件是这一问题的主题触发我没有在问题中说明过一点代码。现代浏览器都支持DOM方法addEventListener但为了支持旧的浏览器谁只有attachEvent我又增加了以下抽象：

registerListener(target, type, callback) { 
    const addListener = target.addEventListener || target.attachEvent; 
    const eventName = target.addEventListener ? type : 'on' + type; 

    addListener(eventName, callback); 
},

这样做的问题是，“这个”上下文在呼叫丢失。所以，我改为以下：

registerListener(target, type, callback) { 
    const listenerFunction = target.addEventListener ? 'addEventListener' : 'attachEvent'; 
    const eventName = target.addEventListener ? type : 'on' + type; 

    target[listenerFunction](eventName, callback); 
},

来源

2016-04-04 07:30:04 ken

你可以使用addListener.apply（target，[eventName，callback]）。我正要建议ui-animate函数需要一个工作元素，但实际上是事件源的元素没有指定，也许是因为摇动ui-animate是在按钮外部和窗口内部定义的。很高兴您解决它。 –

的addEventListener没有连接到正确的范围

回答

相关问题