首页 > 代码库 > DOM2级事件对象、添加事件、阻止默认事件、阻止冒泡事件、获取事件对象目标的兼容处理
DOM2级事件对象、添加事件、阻止默认事件、阻止冒泡事件、获取事件对象目标的兼容处理
事件对象——兼容处理
1 /* 2 * 功能: 事件对象兼容3 * 参数: 表示常规浏览器的事件对象e4 */5 function getEvent(e) {6 7 // 如果存在e存在，直接返回，否则返回window.event8 return e || window.event;9 }
获取事件所对应的目标——兼容处理
1 /* 2 3 * 功能: 获取事件所对应的目标 4 5 * 参数: 表示常规浏览器的事件对象e 6 7 */ 8 9 function getTargetByEvent() {10 11 // 如果存在e.target，直接返回，否则返回window.event.srcElement12 13 return e.target || window.event.srcElement;14 15 }
添加事件——兼容处理
1 /* 2 3 * 功能: 添加事件 4 5 * 参数: 6 7 */ 8 9 function addEventHandler(element, eventName, handler) {10 11 // 三目(条件)运算符，如果存在document.addEventListener直接调用，否则调用document.attachEvent这个方法12 13 document.addEventListener ? element.addEventListener(eventName, handler, flase) : element.attachEvent(‘on‘ + eventName, handler);14 15 }
阻止默认事件——兼容处理
1 /* 2 3 * 功能: 阻止默认事件 4 5 * 参数: 表示要阻止的事件对象 6 7 */ 8 9 function stopDefaultEvent(e) {10 11 // 三目(条件)运算符，如果存在e.preventDefault直接调用，否则使用window.event.returnValue = http://www.mamicode.com/false;12 13 e.preventDefault ? e.preventDefault() : (window.event.returnValue = http://www.mamicode.com/false);14 15 }
阻止冒泡事件——兼容处理
1 /* 2 3 * 功能: 阻止冒泡事件 4 5 * 参数: 表示要阻止的事件对象 6 7 */ 8 9 function stopBubbleEvent(e) {10 11 e.stopPropagation ? e.stopPropagation() : (window.event.cancelBubble = true);12 13 }
以上为一些事件对象所涉及到的兼容处理。
其实JS的兼容处理比较简单，无非就是判断浏览器是否有此方法(对象)，如果有的话，就直接调用(获取)，否则使用另外的方法。
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。