attachEvent与addEventListener区别
适应的浏览器版本不同,同时在使用的过程中要注意
attachEvent方法          按钮onclick
addEventListener方法    按钮click

两者使用的原理:可对执行的优先级不一样的事件进行操作:
attachEvent方法,为某一事件附加其它的处理事件。(不支持Mozilla系列)

addEventListener方法 用于 Mozilla系列

举例:

Js代码
  • document.getElementById(“btn”).onclick = method1;
  • document.getElementById(“btn”).onclick = method2;
  • document.getElementById(“btn”).onclick = method3;如果这样写,那么将会只有medhot3被执行

写成这样:

Js代码
  • var btn1Obj = document.getElementById(“btn1″); //object.attachEvent(event,function);
  • btn1Obj.attachEvent(“onclick”,method1);
  • btn1Obj.attachEvent(“onclick”,method2);
  • btn1Obj.attachEvent(“onclick”,method3);执行顺序为method3->method2->method1

如果是Mozilla系列,并不支持该方法,需要用到addEventListener var btn1Obj = document.getElementById(“btn1″);
//element.addEventListener(type,listener,useCapture);
btn1Obj.addEventListener(“click”,method1,false);
btn1Obj.addEventListener(“click”,method2,false);
btn1Obj.addEventListener(“click”,method3,false);执行顺序为method1->method2->method3

使用实例:

Js代码

1. var el = EDITFORM_DOCUMENT.body;

//先取得对象,EDITFORM_DOCUMENT实为一个iframe

if (el.addEventListener){

  el.addEventListener(‘click’, KindDisableMenu, false);

}

else if (el.attachEvent){

  el.attachEvent(‘onclick’, KindDisableMenu);

}

2. if (window.addEventListener) {

  window.addEventListener(‘load’, _uCO, false);

} else if (window.attachEvent) {

  window.attachEvent(‘onload’, _uCO);

}

//先取Js代码

  detachEvent(‘onclick’,func);//ie下使用删除事件func

  removeEventListener(‘click’,func);//Mozilla下,删除事件func

摘自:http://blog.163.com/wumingli456@126/blog/static/288964142010755811775/

JS事件监听 JS:attachEvent和addEventListener 使用方法的更多相关文章

  1. (转载)JS事件监听 JS:attachEvent和addEventListener使用方法

    (转载)http://www.chhua.com/web-note146 attachEvent和addEventListener使用方法 Js代码 <html> <head> ...

  2. js 事件监听 兼容浏览器

    js 事件监听 兼容浏览器   ie 用 attachEvent   w3c(firefox/chrome)  用 addEventListener 删除事件监听 ie 用 detachEven   ...

  3. js事件监听机制(事件捕获)总结

    在前端开发过程中我们经常会遇到给页面元素添加事件的问题,添加事件的js方法也很多,有直接加到页面结构上的,有使用一些js事件监听的方法,由于各个浏览器对事件冒泡事件监听的机制不同,le浏览器只有事件冒 ...

  4. js事件监听机制(事件捕获)

    在前端开发过程中我们经常会遇到给页面元素添加事件的问题,添加事件的js方法也很多,有直接加到页面结构上的,有使用一些js事件监听的方法,由于各个浏览器对事件冒泡事件监听的机制不同,le浏览器只有事件冒 ...

  5. js 事件监听 冒泡事件

    js 事件监听  冒泡事件   的取消 [自己写框架时,才有可能用到] <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitiona ...

  6. js事件监听-addEventListener (w3c标准) 和 attachEvent(ie)

    研究了一个小时,没看懂这两个属性 window.onload = function(){ var oDiv = document.getElementById("J_myDiv") ...

  7. js 事件监听封装

    var eventUtil={//添加句柄 //element,节点 //type,事件类型 //handler,函数 addHandler:function(element,type,handler ...

  8. js事件监听

    /* 事件监听器 addEventListener() removeEventListener() 传统事件绑定: 1.重复添加会,后添加的后覆盖前面的. */ 示例代码中的html结构: <b ...

  9. Js事件监听封装(支持匿名函数)

    先看demo:http://liutian1937.github.io/demo/EventListen.html/*绑定事件与取消绑定*/ var handleHash = {}; var bind ...

随机推荐

  1. 【转】linux设备驱动之MMC SD卡——核心层简单分析

    原文网址:http://blog.chinaunix.net/uid-28685940-id-3889878.html /*************************************** ...

  2. 【转】virtualbox 4.08安装虚机Ubuntu11.04增强功能失败解决方法

    原文网址:http://fuliang.iteye.com/blog/1102998 在笔记本安装Ubuntu11.04增强功能失败 引用 fuliang@fuliang-VirtualBox:~$ ...

  3. [JLOI2013]卡牌游戏

    [题目描述 Description] N个人坐成一圈玩游戏.一开始我们把所有玩家按顺时针从1到N编号.首先第一回合是玩家1作为庄家.每个回合庄家都会随机(即按相等的概率)从卡牌堆里选择一张卡片,假设卡 ...

  4. List迭代循环时出现分问题

    一个List,通过迭代之后给List中的实体重新赋值,代码如下 public List getListByPage(Page currPage) { Map recordTypeMap = BusnD ...

  5. Bzoj 1227: [SDOI2009]虔诚的墓主人 树状数组,离散化,组合数学

    1227: [SDOI2009]虔诚的墓主人 Time Limit: 5 Sec  Memory Limit: 259 MBSubmit: 895  Solved: 422[Submit][Statu ...

  6. 【解决】Internet访问看似正常(无叹号受限)却打不开网页

    嘛╮(╯▽╰)╭ 可能是前几天中了一等奖败了人品 .. 今天果断受点小挫折 事情是这样的:昨晚电脑在不插电的情况下打了一小时“剑灵”,有点烫,电量剩30%,关机睡觉,今早发现上不去网页了! 桌面右下角 ...

  7. 《Linear Algebra and Its Applications》-chaper1-线性方程组- 线性变换

    两个定理非常的简单显然,似乎是在证明矩阵代数中的基本运算律.但是它为后面用“线性变换”理解矩阵-向量积Ax奠定了理论基础. 结合之前我们讨论过的矩阵和向量的积Ax的性质,下面我们就可以引入线性变换了. ...

  8. [置顶] shell变量赋值-linux

    Shell变量赋值 命名须规则: 1)使用变量无需事先声明 2)首个字符必须为字母(a-z,A-Z) 3)中间不能有空格,可以使用下划线(_) 4)不能使用标点符号 5)不能使用bash里的关键字(可 ...

  9. Java集合类详解

    集合类说明及区别Collection├List│├LinkedList│├ArrayList│└Vector│ └Stack└SetMap├Hashtable├HashMap└WeakHashMap ...

  10. 新安装XAMPP,phpMyAdmin错误:#1045 - Access denied for user 'root'@'localhost' (using password: NO)

    错误如下: 打开D:\Program Files\xampp\phpMyAdmin(你的xampp的安装目录下的phpMyAdmin目录)目录下的config.inc.php文件 将 改为 然后,错误 ...