兼容各主流浏览器的事件绑定（在同一个事件上添加多个处理函数）。

1.绑定方法：

 //IE attachEvent(事件名, 函数)

 oBtn.attachEvent('onclick', aaa);

 oBtn.attachEvent('onclick', bbb);

 //FF    addEventListener(事件名, 函数, 是否捕获 false)

 oBtn.addEventListener('click', aaa, false);

 oBtn.addEventListener('click', bbb, false);

2.例子：

 <html xmlns="http://www.w3.org/1999/xhtml">

 <head>

 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

 <title>无标题文档</title>

 <script type="text/javascript">

 function aaa(){

     alert('a');

 }

 function bbb(){

     alert('b');

 }

 window.onload=function (){

     var oBtn=document.getElementById('btn1');

     /*oBtn.onclick=aaa;

     oBtn.onclick=bbb;  覆盖掉aaa*/

     if(oBtn.attachEvent){

         oBtn.attachEvent('onclick', aaa);

         oBtn.attachEvent('onclick', bbb);

     }

     else{

         oBtn.addEventListener('click', aaa, false);

         oBtn.addEventListener('click', bbb, false);

     }

 };

 </script>

 </head>

 <body>

 <input id="btn1" type="button" value="aaa" />

 </body>

 </html>

3.如何用于写一个用于时间绑定的公共函数

例子：

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>无标题文档</title>

<script type="text/javascript">

function bind(obj, evname, fn) {

    if (obj.addEventListener) {

        obj.addEventListener(evname, fn, false);

    } else {

        obj.attachEvent('on' + evname, function() {

            fn.call(obj);

        });

    }

}

function aaa(){

    alert('a');

}

function bbb(){

    alert('b');

}

window.onload=function (){

    var oBtn=document.getElementById('btn1');

    bind(oBtn, 'click', aaa);

    bind(oBtn, 'click', bbb);

};

</script>

</head>

<body>

<input id="btn1" type="button" value="aaa" />

</body>

</html>
4.解除绑定（以IE为例）：
 <script type="text/javascript">

 window.onload=function ()

 {

     var oBtn=document.getElementById('btn1');

     //IE    attachEvent/detachEvent

     //FF    addEventListener/removeEventListener

     var a=function (){

         alert('dafsdf');

     };

     oBtn.attachEvent('onclick', a);

     oBtn.detachEvent('onclick', a);

 };

 </script>

注意：匿名函数解除不掉绑定（因为即使两个匿名函数长的一样，但是不是同一个函数）

attachEvent,addEventListener事件绑定的更多相关文章

  1. javascript之事件绑定

    曾经写过一篇随笔,attachEvent和addEventListener,跟本文内容有很多相似之处 本文链接:javascript之事件绑定 1.原始写法 <div onclick=" ...

  2. 兼容8事件绑定与解绑addEventListener、removeEventListener和ie的attachEvent、detachEvent

    兼容8事件绑定与解绑addEventListener.removeEventListener和ie的attachEvent.detachEvent   ;(function(){ // 事件绑定 bi ...

  3. 监听事件绑定（addEventListener、attachEvent）和移除（removeEventListener、detachEvent）

    /** * @description 事件绑定,兼容各浏览器 * @param target 事件触发对象 * @param type 事件 * @param func 事件处理函数 */ funct ...

  4. IE attachEvent事件处理程序(事件绑定的函数)的this指向的是window不是执行当前事件的dom元素

    IE attachEvent事件处理程序(事件绑定的函数)的this指向的是window不是执行当前事件的dom元素. attachEvent(type,listener); listener函数中的 ...

  5. js -- 绑定的click addEventListener 事件只触发一次

    var btn = document.getElementById('btn'); // 添加事件绑定 btn.addEventListener('click', btnClick, false); ...

  6. js addEventListener事件多次绑定问题

    如果为了避免 js addEventListener事件多次绑定问题,可以使用.onclick直接绑定,后一次click绑定会覆盖调前一次.

  7. 事件绑定addEventListener

    通过addEventListener监听函数实现的dom事件绑定 addEventListener可以为当前dom添加一个事件(这个事件可以是个已有的事件),这就无法避免我们在写代码的时候重复去绑定同 ...

  8. jQuery 2.0.3 源码分析 事件绑定 - bind/live/delegate/on

    事件(Event)是JavaScript应用跳动的心脏,通过使用JavaScript ,你可以监听特定事件的发生,并规定让某些事件发生以对这些事件做出响应 事件的基础就不重复讲解了,本来是定位源码分析 ...

  9. js事件绑定及深入

    学习要点: 1.传统事件绑定的问题2.W3C事件处理函数3.IE事件处理函数4.事件对象的其他补充 事件绑定分为两种:一种是传统事件绑定(内联模型,脚本模型),一种是现代事件绑定(DOM2级模型).现 ...

随机推荐

  1. 在ubuntu16.04 下安装haproxy 1.5.11 做tcp负载均衡

    由于haproxy需要FQ下载,所以从csdn下载了较为新版的haproxy1.5.11,安装过程如下: 1. 解压haproxy-1.5.11.tar.gz : tar xzvf haproxy-1 ...

  2. select 取值

    select 标签是下拉列表标签.在网站中使用很多. 在后台服务器标记的下拉框在前台都会生成select标签. 他的子项就是option标签.要确认一个项是否被选中,就要确定子项中的selected标 ...

  3. 【redis】04set类型和zset类型

    sets类型   sets类型及操作   Set类型是一个集合,他是string类型的无序集合,也就是说咱们的set是没有顺序的, Set是通过hash table实现的,添加.删除和查找的复杂度都是 ...

  4. POJ 1915

    #include<iostream> #include<stdio.h> #define MAXN 350 #include"queue" using na ...

  5. GET和POST的区别，就是明信片和信封的区别

  6. POJ 3280 Cheapest Palindrome（DP）

    题目链接 题意 :给你一个字符串,让你删除或添加某些字母让这个字符串变成回文串,删除或添加某个字母要付出相应的代价,问你变成回文所需要的最小的代价是多少. 思路 :DP[i][j]代表的是 i 到 j ...

  7. HDU 1573 X问题 （中国剩余定理）

    题目链接 题意 : 中文题不详述. 思路 : 中国剩余定理.求中国剩余定理中解的个数.看这里看这里 #include <stdio.h> #include <iostream> ...

  8. 简单易懂的现代魔法——Play Framework攻略3

    接前文:http://www.cnblogs.com/Kassadin/p/4343682.html 目前为止,我们已经研究了Play Framework的体系结构以及Web应用程序的工作原理.本来今 ...

  9. 最长不下降子序列//序列dp

    最长不下降子序列 时间: 1000ms / 空间: 131072KiB / Java类名: Main 描述 求最长不下降子序列的长度 输入格式 第一行为n,表示n个数第二行n个数 输出格式 最长不下降 ...

  10. unity UGUI动态字体显示模糊

    设置Unity中ttf文件的Character为Unicode,点击apply