JS事件总结
2015-10-22 16:39
585 查看
一、事件流
事件流描述的是从页面中接受事件的顺序。IE的事件流是事件冒泡流,而Netscape的事件流是事件捕获流
跨浏览器的事件处理程序
var eventUtil = { //添加句柄 addHandle: function(element, type, handle) { if (element.addEventListener) { element.addEventListener(type, handle, false); } else if (element.attachEvent) { element.attachEvent("on" + type, handle); } else { element["on" + type] = handle; }; }, //删除句柄 removeHandle: function(element, type, handle) { if (element.removeEventListener) { element.removeEventListener(type, handle, false); } else if (element.dettachEvent) { element.dettachEvent("on" + type, handle); } else { element["on" + type] = null; }; }, // 阻止冒泡 noBubble: function() { if (event && event.stopPropagation) { event.stopPropagation(); console.log('notIe'); } else { window.event.cancelBuble = true; console.log('ie'); } }, // 阻止元素默认行为 noPrevent: function() { if (event && event.preventDefault) { event.preventDefault(); console.log('notIe'); } else { // console.log(event.preventDefault); window.event.returnValue = false; console.log('ie'); } } } //调用 eventUtil.addHandle(element,"click",Fun);
1. DOM中的事件对象
(1)、type:获取事件类型(2)、target:事件目标
(3)、stopPropagation() 阻止事件冒泡
(4)、preventDefault() 阻止事件的默认行为
2. IE中的事件对象
(1)、type:获取事件类型(2)、srcElement:事件目标
(3)、cancelBubble=true阻止事件冒泡
(4)、returnValue=false阻止事件的默认行为
参考文档:
简书-JS事件探秘
相关文章推荐
- JQuery1——基础($对象,选择器,对象转换)
- Android Manifest 用法
- Android学习笔记(二九):嵌入浏览器
- Android java 与 javascript互访(相互调用)的方法例子
- 峰回路转,Firefox 浏览器即将重返 iOS 平台
- 峰回路转,Firefox 浏览器即将重返 iOS 平台
- JavaScript演示排序算法
- javascript实现10进制转为N进制数
- 2019年开发人员应该学习的8个JavaScript框架
- HTML中的script标签研究
- 对一个分号引发的错误研究
- 异步流程控制:7 行代码学会 co 模块
- ES6 走马观花(ECMAScript2015 新特性)
- JavaScript拆分字符串时产生空字符的原因
- Canvas 在高清屏下绘制图片变模糊的解决方法
- IE8开发人员工具教程(二)
- IE右键菜单被修改