Question

我正在尝试将模糊事件添加到某些表单元素中，这些元素将为我运行一些代码。在初始模糊之后，我正在尝试从该元素中删除侦听器，以便它不会再次触发。

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

更新：在所有浏览器中全面运作

(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

您正在尝试删除wtHelper.test2函数，该函数从未被定义为“blur”事件的侦听器。你可能想做这样的事情：

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

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

Answer 2

您尝试将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一样。

添加addEventListener后似乎无法removeEventListener

2 个答案: