Javascript关于attachEvent和addEventListener区别与兼容写法

Mozilla中:

addEventListener的使用方式:

target.addEventListener(type, listener, useCapture);

target: 文档节点、document、window 或 XMLHttpRequest。
type: 字符串,事件名称,不含“on”,比如“click”、“mouseover”、“keydown”等。
listener :实现了 EventListener 接口或者是 JavaScript 中的函数。
useCapture :是否使用捕捉,一般用 false
。例如:document.getElementById(“testText”).addEventListener(“keydown”,
function (event) { alert(event.keyCode); }, false);

IE中:

target.attachEvent(type, listener);
target: 文档节点、document、window 或 XMLHttpRequest。
type: 字符串,事件名称,含“on”,比如“onclick”、“onmouseover”、“onkeydown”等。
listener :实现了 EventListener 接口或者是 JavaScript 中的函数。
例如:document.getElementById(“txt”).attachEvent(“onclick”,function(event)
{alert(event.keyCode);});

兼容的写法:

     if (window.attachEvent) {

    obj.attachEvent("onclick", function() {alert(even.innerHTML) });//ie
    }
    else {
    obj.addEventListener("click", function() { alert(even.innerHTML) }, false); //火狐
    }
时间: 2024-12-09 11:12:51

Javascript关于attachEvent和addEventListener区别与兼容写法的相关文章

原生JS forEach()和map()遍历的区别以及兼容写法

一.原生JS forEach()和map()遍历 共同点: 1.都是循环遍历数组中的每一项. 2.forEach() 和 map() 里面每一次执行匿名函数都支持3个参数:数组中的当前项item,当前项的索引index,原始数组input. 3.匿名函数中的this都是指Window. 4.只能遍历数组. 1.forEach() 没有返回值. arr[].forEach(function(value,index,array){ //do something }) 参数:value数组中的当前项,

attachEvent和addEventListener区别

  一般来说,可以直接封装成这种形式: var addEvent = function(element,type,handler){ if(element.addEventListener){ //DOM2级 element.addEventListener(type,handler,false); //false为冒泡,true为捕获 }else if(element.attachEvent){ //IE element.attachEvent("on"+type,function(

attachEvent与addEventListener的区别 真实例子

近日遇到attachEvent与addEventListener两个事件,哟,果断研究一下~~ 先普及一下基本知识: attachEvent与addEventListener的作用:为某一事件附加其它的处理事件. 网上普遍都是说attachEvent用于非Mozilla系列,addEventListener用于Mozilla系列. (Mozilla系列在浏览器而言,即指火狐浏览器,本人认为也可以指支持w3c标准的系列浏览器) 理论上是这么说,还是得自己动手试一试! 结合查阅资料写了以下代码进行测

JS事件监听 JS:attachEvent和addEventListener 使用方法

attachEvent与addEventListener区别 适应的浏览器版本不同,同时在使用的过程中要注意attachEvent方法          按钮onclickaddEventListener方法    按钮click 两者使用的原理:可对执行的优先级不一样的事件进行操作:attachEvent方法,为某一事件附加其它的处理事件.(不支持Mozilla系列) addEventListener方法 用于 Mozilla系列 举例: Js代码 document.getElementByI

Javascript添加事件的addEventListener()及attachEvent()区别分析

Mozilla中: addEventListener的使用方式: target.addEventListener(type, listener, useCapture); target: 文档节点.document.window 或 XMLHttpRequest. type: 字符串,事件名称,不含“on”,比如“click”.“mouseover”.“keydown”等. listener :实现了 EventListener 接口或者是 JavaScript 中的函数. useCapture

javascript中attachEvent事件 跟 addEventListener 事件

拷贝自 http://www.jb51.net/article/66111.htm 本文实例讲述了javascript中attachEvent用法.分享给大家供大家参考.具体分析如下: 一般我们在JS中添加事件,是这样子的 obj.onclick=method 这种绑定事件的方式,兼容主流浏览器,但如果一个元素上添加多次同一事件呢? ? 1 2 3 obj.onclick=method1 obj.onclick=method2 obj.onclick=method3 如果这样写,那么只有最后绑定

Javascript下IE与Firefox下的差异兼容写法总结

http://www.jb51.net/article/23923.htm 总结一部分IE和Firefox的javascript差异写法,对于像书写多浏览器兼容性更好的代码,可以参考下. window.event对象差异 IE:有window.event对象 FF:没有window.event对象.可以通过给函数的参数传递event对象.如onmousemove=doMouseMove(event) 获取鼠标当前坐标 IE:event.x和event.y. FF:event.pageX和even

attachEvent与addEventlistener兼容性

关于原生事件绑定中attachEvent与addEventlistener中兼容性以及attachEvent函数中this指代window有关问题 By odacash   at 2014-07-01   29 阅读   0 回复   0.0 希赛币 请点击下面回答中的"采纳为答案"按钮,选择贡献(希赛币)比率后,点击"确认结算"按钮.       合计0人 0%   关于原生事件绑定中attachEvent与addEventlistener中兼容性以及attach

js绑定事件方法:addEventListener与attachEvent的不同浏览器的兼容性写法

js的事件绑定方法中,ie仅仅支持attachEvent,而FF和Chrome仅仅支持addEventListener,所以就必须为这两个方法做兼容处理,原理是先推断attachEvent仅仅否为真(存在),假设为真则用attachEvent()方法.否则的话就用addEventListener(). 另外,为了避免每次绑定事件时都要做推断.能够封装一个函数myAddEvent(obj,ev,fn){}. 代码例如以下: <!DOCTYPE html> <html> <hea