添加addEventListener後似乎無法removeEventListener

我試圖添加一個模糊事件到一些表單元素，它會爲我運行一些代碼。在最初的模糊之後，我試圖從該元素中刪除偵聽器，以便它不會再次觸發。添加addEventListener後似乎無法removeEventListener

onblur事件工作正常，但由於某種原因eventListener.remove似乎從未觸發，所以模糊不會被刪除。任何想法，我做錯了什麼？

基於lincolnk的意見更新，但仍然不是在IE工作：

(function() { 
var els = [document.getElementsByTagName('input'), 
        document.getElementsByTagName('select')], 

     eventListener = { 
      add: function(el, ev, fn) { 
       if (window.addEventListener) { // Standard 
       el.addEventListener(ev, fn, false); 
       } else if (window.attachEvent) { // IE 
       var iefn = function() { fn.call(el) }; 
       el.attachEvent('on' + ev, iefn) 
       } else { return false }; 
      }, 

      remove: function(el, ev, fn) { 
       if (window.removeEventListener) { // Standard 
       el.removeEventListener(ev, fn, false) 
       } else if (window.detachEvent) { // IE 
       var iefn = function() { fn.call(el) }; 
       el.detachEvent('on' + ev, iefn) 
       } else { return false }; 
      } 
     }, 

     wtFormTracker = function() { 
      console.log(this.name); 
      eventListener.remove(this, 'blur', wtFormTracker); 
     }; 

for (var i = 0, j = els.length; i < j; i++) { 
    for (var y = 0, z = els[i].length; y < z; y++) { 
     eventListener.add(els[i][y], 'blur', wtFormTracker); 
    } 
} 
})();

UPDATE：在所有瀏覽器

(function() { 
var els = [document.getElementsByTagName('input'), 
        document.getElementsByTagName('select')], 

     eventListener = { 
      add: function(el, ev, fn) { 
       if (window.addEventListener) { // Standard 
       el.addEventListener(ev, fn, false); 
       } else if (window.attachEvent) { // IE 
       el.attachEvent('on' + ev, fn) 
       } else { return false }; 
      }, 

      remove: function(el, ev, fn) { 
       if (window.removeEventListener) { // Standard 
       el.removeEventListener(ev, fn, false) 
       } else if (window.detachEvent) { // IE 
       el.detachEvent('on' + ev, fn) 
       } else { return false }; 
      } 
     }, 

     wtFormTracker = function(el) { 
      var target = el.target || el.srcElement; 
      console.log("'WT.ti','title-of-page','WT.ac', " + target.name); 
      eventListener.remove(target, 'blur', wtFormTracker); 
     }; 

for (var i = 0, j = els.length; i < j; i++) { 
    for (var y = 0, z = els[i].length; y < z; y++) { 
     eventListener.add(els[i][y], 'blur', wtFormTracker); 
    } 
} 
})();

來源

2010-10-20 CoryDorning

你想刪除test2爲blur的處理程序，但你有沒有在這個腳本中任何指定它。我也猜測使用this在test1指向window這可能不是你想要的。

test1: function(e) { 
      console.log('add'); 
      var target = e.target || e.srcElement; 
      eventListener.remove(target , 'blur', wtHelper.test1); // probably? 
     },

此外，如果你在IE中查看此，您正在創建attachEvent一個全新的功能，然後再創建一個全新的功能detachEvent，你就不會得到這樣的任何地方。提供原始fn參數到attachEvent/detachEvent的方法沒有任何問題，就像您爲addEventListener所做的一樣。

來源

2010-10-20 02:22:29 lincolnk

我發佈了更新的代碼...這是你指的IE？ – CoryDorning 2010-10-20 02:42:20

@CoryDorning看起來不錯。 – lincolnk 2010-10-20 05:14:06

您正在試圖刪除wtHelper.test2功能全面運作，這從未被定義爲'模糊'事件的監聽者。你可能想要做這樣的事情：

wtHelper = { 
     test1: function() { 
      console.log('add'); 
      wtHelper.test2(); 
     }, 

     test2: function() { 
      console.log('remove'); 
      eventListener.remove(this, 'blur', wtHelper.test1); 
     } 
    };

來源

2010-10-20 02:21:45 ArtBIT

添加addEventListener後似乎無法removeEventListener

回答

相關問題