RemoveEventListener 不适用于命名函数

Question

我绞尽脑汁想知道为什么 removeEventListener 不起作用。它应该是一次性事件，所以我在回调函数中包含了 removeEventListener。但是事件每次都会触发。

var group = ...//some div's ID
var img_button = document.createElement("SPAN");
    img_button.setAttribute("id","imgbutton_"+group);
if (figures.addEventListener){
    figures.addEventListener(
    'click', function(e){if (!e) e = window.event;e.stopPropagation();}, false);
    img_button.addEventListener(
    'mouseover', loadImg(group), false);
    }else{...};

和回调loadImg：

function loadImg(nodeId){//loading images when needed
    return function(e){
        if (!e) e = window.event;
[...]
    //remove eventlistener when executed once
        var sp = (e.target ? e.target : e.srcElement);

        if (sp.removeEventListener){
            sp.removeEventListener(
            'mouseover', loadImg);
        } else {...};
};

匿名函数可以保留，但是loadImg我只需要一次。我忘记了什么？

Answer 1

loadImg 不是监听函数的名称。您附加了一个从 loadImg().

返回的匿名函数

要解决这个问题，可以给实际的事件处理函数起个名字：

return function handler (e){
            :
    this.removeEventListener('mouseover', handler, false);
            :
}

A working demo at jsFiddle.

事件处理程序中的

this 自动引用事件附加到的元素。

RemoveEventListener 不适用于命名函数

RemoveEventListener does not work on named function

javascript

event-handling

javascript-events