javascript - 添加 addEventListener 后似乎无法删除 EventListener

Question

我正在尝试向某些表单元素添加模糊事件，这些元素将为我运行一些代码。在初始模糊之后，我试图从该元素中移除监听器，以使其不再触发。

onblur 事件工作正常，但出于某种原因，eventListener.remove 似乎永远不会触发，因此 blur 不会被删除。关于我做错了什么有什么想法吗？

根据 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);
    }
}
})();

更新:在所有浏览器中完全可用

(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);
    }
}
})();

Answer 1

您正在尝试删除 test2 作为 blur 的处理程序，但您尚未在此脚本中的任何位置分配它。我还猜测 test1 中 this 的使用指向 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 所做的那样。