添加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

回答

相关问题