Question

我在mouseover添加了addEventListener()功能，并尝试使用mouseout在removeEventListener()上删除它。添加该功能可以正常工作，但不会在mouseout上删除。

这里的代码有什么问题？如何修改删除功能？

    var elem = document.getElementById('a');

function highLight() {

var p = document.getElementById('p');
var strong = p.getElementsByTagName('strong');
for(var i = 0; i < strong.length; i++) {
     strong[i].style.color = 'red';
}   

}
elem.addEventListener('mouseover', highLight, false);

elem.removeEventListener('mouseout', highLight, false);

Answer 1

我猜是要删除红色，而不是真正删除eventListener

var elem = document.getElementById('a');

function highLight() {
    var p = document.getElementById('p');
    var strong = p.getElementsByTagName('strong');
    for (var i = 0; i < strong.length; i++) {
        strong[i].style.color = 'red';
    }
}

function unhighLight() {
    var p = document.getElementById('p');
    var strong = p.getElementsByTagName('strong');
    for (var i = 0; i < strong.length; i++) {
        strong[i].style.color = 'black';
    }
}


elem.addEventListener('mouseenter', highLight, false);

elem.addEventListener('mouseleave', unhighLight, false);

FIDDLE

Answer 2

如果我理解正确，我想你想在'mouseover'事件下添加'mouseout'事件，然后在'mouseout'的回调函数中删除它们。

那就是更像这样的东西：

elem.addEventListener('mouseover', highLight, false);
elem.addEventListener('mouseout', function () {
    elem.removeEventListener('mouseover');
    elem.removeEventListener('mouseout');
}, false);

使用addEventListener javascript添加后，removeEventListener（）不删除函数

2 个答案: