Question

我正在尝试删除已创建的span元素的事件侦听器，其中调用的函数位于闭包内。我尝试了各种方法，但似乎都没有。

var MyClass = function () {}

MyClass.prototype.addSpan = function (el) {
    var span = document.createElement('span');
    span.innerHTML = "Text here";
    el.appendChild(span);
    span.addEventListener('click', (function (obj) { 
        return function () { 
            obj.removeSpan(); 
        }
    })(this), false);
}

MyClass.prototype.removeSpan = function () {
    alert('removing span');
    this.removeEventListener('click', arguments.callee, false);
    // .... remove span .... 
}

myclass = new MyClass();

myclass.addSpan(document.getElementById('box'));

我也用过

this.removeEventListener('click', (function (obj) { 
    return function () { 
        obj.removeSpan(); 
    }
})(this), false);

取代this.removeEventListener('click', arguments.callee, false);但没有运气。

非常感谢任何帮助！

Answer 1

var MyClass = function () {}
MyClass.prototype.listener=null;
MyClass.prototype.addSpan = function (el) {
    var span = document.createElement('span');
    span.innerHTML = "Text here";
    el.appendChild(span);
    span.addEventListener('click', (function (obj) { 
        return obj.listener = function () { 
            obj.removeSpan(this); // here 'this' refers to 'span'
        }
    })(this), false);
}

MyClass.prototype.removeSpan = function (el) {
    alert('removing span');
    el.removeEventListener('click', this.listener, false);
    // .... remove span .... 
}

myclass = new MyClass();
myclass.addSpan(document.getElementById('box'));

如果没有侦听器的引用，则无法将其删除，因此我还向MyClass的原型添加了一个属性（侦听器），然后将引用作为return obj.listener返回，并且您还需要通过我已经通过了obj.removeSpan(this);和removeSpan我收到el的对象，所以我可以完成el.removeEventListener，希望它有所帮助。

你也可以这样做

var MyClass = function () {this.listener=null;}

而不是

MyClass.prototype.listener=null;

这是example。

Answer 2

尝试将事件处理程序更改为此。

span.addEventListener('click', (function (obj) { 

        span.onclick = null;

        return function () { 
            obj.removeSpan(); 
        }
    })(this), false);

使用JavaScript中的匿名函数调用删除事件侦听器

2 个答案: