如何从页面中删除每个侦听器?

时间:2017-04-03 06:52:24

标签: javascript jquery html events dom-events

我知道如何从元素中删除侦听器,但是如何从页面上的每个元素中删除每个事件侦听器?

jQuery和纯JS解决方案会很好。

4 个答案:

答案 0 :(得分:2)

我建议调查jQuery的.off function。 此外,基于this stackoverflow question,我将尝试使用以下代码删除所有每个侦听器

$("body").find("*").off();

希望这可以帮到你。

答案 1 :(得分:1)

你也可以尝试一下。

http://jsfiddle.net/LkfLezgd/9/

$("#cloneButton").click(function() {
$('body').replaceWith($('body').clone().html());
});

答案 2 :(得分:1)

您可以按照以下方式遍历表单元素,以首选方式删除事件侦听器。

执行此操作的最快方法是仅克隆将删除所有事件侦听器的节​​点,但如果使用'onclick'属性,则不会删除。

DependencyResolver.SetResolver(new StructureMapDependencyResolver(() => Container ?? ObjectFactory.Container));
            ObjectFactory.Container.Configure(cfg =>
            {
                cfg.AddRegistry(new StandardRegistry());
                cfg.AddRegistry(new ControllerRegistry());
                cfg.AddRegistry(new ActionFilterRegistry(() => Container));
                cfg.AddRegistry(new MvcRegistry());                
            }); 
document.getElementById('button').addEventListener('click', onClick, false);

function onClick() {
   console.log('Form clicked');
   var form = document.getElementById('myForm');

   for(var i = 0; i < form.elements.length; i++){
       var elm = form.elements[i];
       removeEvents(elm);
   }
}

function removeEvents(elm) {
  // The fastest way to do this is to just clone the node, which will remove all event listeners:

   var new_element = elm.cloneNode(true);
   elm.parentNode.replaceChild(new_element, elm);
}

答案 3 :(得分:1)

只需克隆HTML dom,默认情况下会删除事件。

这是一个例子。

<html>

<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
    <script>
        $(document).ready(function () {
            $("#EventButton").click(function () {
                alert("Click event worked");
                var old_element = document.documentElement;
                var new_element = old_element.cloneNode(true);
                old_element.parentNode.replaceChild(new_element, old_element);
            });
        });
    </script>
</head>

<body>
    <button id="EventButton">Remove Events</button>
</body>

</html>