移除addeventlistener（80jquery怎样添加和移除事件监听函数）

本文目录

• 80jquery怎样添加和移除事件监听函数
• js/jquery 如何移除自定义函数
• 使用removerEventListener没有正确删除事件绑定

80jquery怎样添加和移除事件监听函数

《!DOCTYPE html》《html》《head lang="en"》    《meta charset="UTF-8"》    《title》《/title》    《style》    .detail_info {        position: absolute;        display: none;    }    《/style》《/head》《body》    《input type ="button" value="测试增加/移除监听" id="btn_bind"/》    《div style="position: relative;" id="box_content"》        《input type="text" class="text" /》        《input type="text" class="text" /》         《!--浮动的详细信息--》        《div class="detail_info" id="box_detail"》            浮动提示信息        《/div》    《/div》    《script type="text/javascript"》    (function () {        document.getElementById("btn_bind").addEventListener("click", function () {            if(this.bindStatue) {                removeEvent();            } else {                bindEvent();            }             this.bindStatue = !this.bindStatue;        });         function removeEvent() {            var inputs = document.querySelectorAll(".text");            for(var i = 0, length = inputs.length; i 《 length; i++) {                inputs.removeEventListener("mousemove", showDetail);                inputs.removeEventListener("mouseout", hideDetail);            }        }         function bindEvent() {            var inputs = document.querySelectorAll(".text");            for(var i = 0, length = inputs.length; i 《 length; i++) {                inputs.addEventListener("mousemove", showDetail);                inputs.addEventListener("mouseout", hideDetail);            }        }         function showDetail(e) {            var e = e || window.event,                box = document.getElementById("box_detail"),                content = document.getElementById("box_content");             box.style.display = "block";            box.style.top = e.clientY - content.offsetTop + "px";            box.style.left = e.clientX - content.offsetLeft + "px";        }         function hideDetail() {            document.getElementById("box_detail").style.display = "none";        }    })();    《/script》《/body》《/html》

js/jquery 如何移除自定义函数

移除一个函数 直接给他重命名即可//例如你有一个函数叫做SayHellofunctionSayHello(){alert(’helloworld’);}console.log(SayHello);//输出函数对象//删除函数varSayHello=null;console.log(SayHello);//输出null；SayHjQuery是一个快速、简洁的JavaScript框架，是继Prototype之后又一个优秀的JavaScript代码库（或JavaScript框架）。jQuery设计的宗旨是“writeLess，DoMore”，即倡导写更少的代码，做更多的事情。它封装JavaScript常用的功能代码，提供一种简便的JavaScript设计模式，优化HTML文档操作、事件处理、动画设计和Ajax交互。jQuery的模块可以分为：入口模块、底层支持模块和功能模块。其核心特性可以总结为：具有独特的链式语法和短小清晰的多功能接口；具有高效灵活的css选择器，并且可对CSS选择器进行扩展；拥有便捷的插件扩展机制和丰富的插件。jQuery兼容各种主流浏览器，如IE6.0+、FF1.5+、Safari2.0+、Opera9.0+等。第一个例子是为元素注册一个事件：Behaviour.register({’#exampleli’:function(e){e.onclick=function(){this.parentNode.removeChild(this);}}});他认为应该改写为：$(’#exampleli’).bind(’click’,function(){this.parentNode.removeChild(this);});第二个例子是为不同的元素注册不同的事件：Behaviour.register({’b.someclass’:function(e){e.onclick=function(){alert(this.innerHTML);}},’#someidu’:function(e){e.onmouseover=function(){this.innerHTML="BLAH!";}}});他认为应该改写为：$(’b.someclass’).bind(’click’,function(){alert(this.innerHTML);});$(’#someidu’).bind(’mouseover’,function(){this.innerHTML=’BLAH!’;});第三个例子是为不断变化的元素注册不同的事件：Behaviour.register({’#fooolli’:function(a){a.title="ListItems!";a.onclick=function(){alert(’Hello!’);};},’#fooolli.tmp’:function(a){a.style.color=’white’;},’#fooolli.tmp.foo’:function(a){a.style.background=’red’;}});他认为应该改写为：$(’#fooolli’).set(’title’,’ListItems!’).bind(’click’,function(){alert(’Hello!’);}).select(’.tmp’).style(’color’,’white’).select(’.foo’).style(’background’,’red’);

使用removerEventListener没有正确删除事件绑定

定义和用法removeEventListener() 方法用于移除由 addEventListener() 方法添加的事件句柄。注意： 如果要移除事件句柄，addEventListener() 的执行函数必须使用外部函数，如上实例所示 (myFunction)。匿名函数，类似 "document.removeEventListener("event", function(){ myScript });" 该事件是无法移除的。这里bind方法返回的新函数显然是个匿名函数，正确的写法是这样：section.addEventListener("animationend", down, false);section.removeEventListener("animationend", down, false);