addEventListener() 事件监听
来源:互联网 发布:java标识符 编辑:程序博客网 时间:2024/06/04 18:12
无意间有人问到了,这个方法,我就学了一下,顺便敲了一个小demo。
addEventListener() 用于向指定元素添加事件。
可以向一个元素添加多次事件或者多次不同事件,后面的事件是不会覆盖前面的。
语法:
element.addEventListener(event,fn,useCaption );
参数说明:tr件,比如 click mouseenter mouseleave
fn 回调函数
useCaption 用于描述是冒泡还是捕获。默认值是false,即冒泡传递。
当值为true,就是捕获传递。
示例代码:
<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>addEventListener</title> <script type="text/javascript" src="js/jquery-3.0.0.js"></script> <style type="text/css"> #content{ width: 100px; height: 100px; background: #f9f; } </style></head><body> <div id="content"></div> <script type="text/javascript"> //addEventListener 用于向指定元素添加事件句柄 //可以向一个元素添加多次点击事件,后一个点击事件不会覆盖前一个点击事件 var content = document.getElementById("content"); content.addEventListener("click",function(){ //alert("支持此方法"); console.log("11"); },false) content.addEventListener("click",function(){ console.log("22"); //add(); },false) content.addEventListener("mouseenter",add,false); function add(){ console.log("我和你"); } content.removeEventListener("mouseenter",add,false); </script></body></html>
注意:
- removeEventListener() 不能移除匿名函数,像上面add()这种是可以的。
- IE8及更早版本和Opear 7.0及更早版本不支持addEventListener()和removeEventListener(),对于这类浏览器我们可以使用detachEvent()来移除事件。
element.detachEvent(event,fn);
跨浏览器解决方案:
var content = document.getElementById("content");if(content.addEventListener){ content.addEventListener(event,add);}else if(content.attchEvent){ content.attchEvent(event,add);}
function add(){ console.log("我们在一起");}
阅读全文
0 0
- addEventListener() 事件监听
- addEventListener() 方法,事件监听
- addEventListener() 方法,事件监听
- javascript attachEvent addEventListener 监听事件
- 事件监听函数:addEventListener() removeEventListener()
- addEventListener注册事件(事件监听)
- As3 addEventListener事件监听传递参数
- 关于attachEvent和addEventListener事件监听
- addEventListener等事件监听的参数细谈
- 3.移动端事件监听addEventListener
- JavaScript事件监听(attachEvent、 addEventListener)
- as3中的addEventListener监听事件如何传参数
- 转:Flash as3 addEventListener事件监听传递参数
- JS事件监听 JS:attachEvent和addEventListener 使用方法
- JS事件监听 JS:attachEvent和addEventListener 使用方法
- JS事件监听 JS:attachEvent和addEventListener 使用方法
- JS事件监听 JS:attachEvent和addEventListener 使用方法
- html学习 - javascript事件监听以及addEventListener参数分析
- AlphaGo围棋论文中文翻译
- Golang开发入门(Linux)
- android中商品展示案例
- 优先级和类型转换分析
- 关于网页js判断"客户端设备类型是移动端还是PC端"的解决方法?
- addEventListener() 事件监听
- C语言之推箱子游戏代码
- 浅谈php中的回调函数和匿名函数
- 6月14日 了解unittest、输出测试报告
- 实际开发中-Block导致循环引用的问题
- Hive元数据库介绍及信息查看
- PHP闭包的路由实例模型
- spark搭建和java示例
- Fiddler的详细介绍