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. SublimeText3使用技巧总结

    Ctrl + R : 查找函数和变量 Ctrl + P: 查找当前工程下面的文件 Ctrl + ":" : 查找变量 Ctrl + "g" : 输入行数跳转到指 ...

  2. (DT系列四)驱动加载中, 如何取得device tree中的属性

    本文以At91rm9200平台为例,从源码实现的角度来分析驱动加载时,Device tree的属性是如何取得的.一:系统级初始化DT_MACHINE_START 主要是定义"struct m ...

  3. HW4.14

    public class Solution { public static void main(String[] args) { int count = 0; char asciiChar; for( ...

  4. PHP导出MySQL数据到Excel

    经常会碰到需要从数据库中导出数据到Excel文件,用一些开源的类库,比如PHPExcel,确实比较容易实现,但对大量数据的支持很不好,很容易到达PHP内存使用上限.这里的方法是利用fputcsv写CS ...

  5. Duff in Love - 588B(素数的判断)

    题目大意:如果一个数的所有因子都不是别的数的平方,那么这个数就是lovely数,现在给定一个数,求出这个数所有因子里面最大的lovely数 分析:很有意思的一道题,如果把这个数因子分解成最基本的苏因子 ...

  6. CUDA8.0+VS2013的安装和配置

    首先声明,本文借鉴自:http://blog.csdn.net/u011314529/article/details/51505029 所以,可参考链接的博文.但原文有个瑕疵就是,cublas.lib ...

  7. Java中的三目运算符 详解

    对于有些选择分支结构,可以使用简单的条件运算符来代替. 如: if(a<b)    min=a;else    min=b; 可以用下面的条件运算符来处理 min=(a<b)?a:b; 其 ...

  8. STL源码剖析之_allocate函数

    SGI STL提供的标准std::allocator中的_allocate函数代码如下: template<class T> inline T* _allocate(ptrdiff_t s ...

  9. 最简单的基于FFMPEG的封装格式转换器(无编解码)

    本文介绍一个基于FFMPEG的封装格式转换器.所谓的封装格式转换,就是在AVI,FLV,MKV,MP4这些格式之间转换(相应.avi,.flv,.mkv,.mp4文件).须要注意的是,本程序并不进行视 ...

  10. GridView导出Excel的超好样例

    事实上网上有非常多关于Excel的样例,可是不是非常好,他们的代码没有非常全,读的起来还非常晦涩.经过这几天的摸索,最终能够完毕我想要导出报表Excel的效果了.以下是我的效果图. 一.前台的页面图 ...