如果我只知道元素和事件,则删除事件监听器

时间:2015-12-25 03:35:31

标签: javascript

如果我只知道元素和事件但是不知道某个函数,有没有办法删除事件监听器?

类似的东西:

var foo = getElementById("foo");
foo.removeEventListener('click');

3 个答案:

答案 0 :(得分:3)

纯JS方法

如果没有对其侦听器方法的引用,则无法分离事件侦听器。

Method definition需要指定listener

带有修改的JS

可以使用某种自定义函数,如下所示:

function addEventListenerAndRemember(element, type, listener, useCapture)
{
    if (!element.myEvents) element.myEvents = {};
    if (!element.myEvents[type]) element.myEvents[type] = [];

    element.myEvents[type].push(listener);

    element.addEventListener(type, listener, useCapture || false);
}

function removeAllEventListener(element, type)
{
    element.myEvents.forEach(function() {
        element.myEvents[type].forEach(function(listener) {
            element.removeEventListener(type, listener);
        });
        element.myEvents[type] = [];
    });
}

我不确定这段代码是否有效 - 这只是展示这个想法的一个例子 您还可以将这些方法包装到addEventListener并覆盖默认行为。就像:

Element.prototype.addEventListenerBase = Element.prototype.addEventListener;
Element.prototype.addEventListener = function(type, listener, useCapture) {
    // do the same
};

jQuery方法

至于我,使用jQuery库看起来就像这里最清晰的解决方案。

您可以通过这种方式附加活动:

$("#foo").on('click', function() {

});

并以简单的方式分离它:

$("#foo").off('click');

答案 1 :(得分:2)

我遇到了同样的问题,并以不同的方式解决了它。

$("#myelement").after($("#myelement")[0].outerHTML).remove()

答案 2 :(得分:0)

您可以查看此代码..希望它会有所帮助..

$("#image").load(function() {
  var width = document.getElementById("image").offsetWidth;
  var height = document.getElementById("image").offsetHeight;
  alert(width+":"+height);
});

如果要删除添加到元素中的所有事件。

<a href="#" id="mydiv">click</a>
<a href="#" onclick="removeHandler()">remove</a>

<script>
document.getElementById("mydiv").addEventListener("click", myFunction);

function myFunction() {
    alert('hello');
}

function removeHandler() {
    document.getElementById("mydiv").removeEventListener("click", myFunction);
}
</script>