的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沒有連接到正確的範圍

回答

相關問題