zoukankan      html  css  js  c++  java
  • 对同一个对象绑定多个响应事件并都执行

    1.因为 onclick=" "  添加的元素响应事件,先添加的事件,会被后来添加的事件层叠掉,只能执行最后一个响应的事件

    所以要用到事件监听addElementLitener()来绑定多个处理函数,而因为兼容性的问题需要兼容代码。

    2.在IE8中,addElementLitener()这个函数不被兼容,而使用attachEvent()。但是,这个又不被谷歌,火狐兼容,所以需要写兼容代码

    3.addElementLitener() 有三个参数,而attachEvent()只有两个参数,前一项的响应事件名前面不用加on,IE需要这是他自己因为违背标准指定的,其他版本是为了兼容IE而做出的让步

    4.在浏览器不支持某个方法时,他会返回的是字符串undefined


    <!DOCTYPE html>
    <html lang="en">
    <head>
      <meta charset="UTF-8">
      <title>绑定多个事件</title>
    </head>
    <body>
      <input type="button" value="点我不花钱" id="btn">


    <script type="text/javascript">
      function myGet(id){
        return document.getElementById(id);
      }

      function addEventListener(element,type,fn){
        // 这个自定义的函数跟下面的方法重名注意区分
        if(typeof element.addEventListener != "undefined"){
          // 一定要注意,undefined是字符串类型,如果去掉在IE中死循环
          element.addEventListener(type,fn,false);
        }else if(typeof element.attachEvent != "undefined"){
          element.attachEvent("on"+type,fn);
          // 响应事件名字如click应该直接写也能直接表达他的意思,而微软非要在前面加一个"on"
        }else{
          element["on"+type] = fn;
          // 如果浏览器上面两个都不兼容,只能写这样一种
        }
      }


      addEventListener(myGet("btn"),"click",function () {
        console.log("陈小帅");
      });
      addEventListener(myGet("btn"),"click",function () {
        console.log("是真的");
      });
      addEventListener(myGet("btn"),"click",function () {
        console.log("真的好帅啊");
      });
    </script>

    </body>
    </html>

  • 相关阅读:
    ssh登录很慢的问题
    Y480&Y580 刷slic2.1全自动教程
    re正则表达式5_*
    linux下查看内存使用情况
    检查linux网络的状况
    Linux Load average负载详细解释
    查看Linux磁盘空间大小
    Linux 批量重命名文件
    Linux 网卡丢包严重
    linux 下vi /vim 中文汉字乱码解决
  • 原文地址:https://www.cnblogs.com/sherryweb/p/10984005.html
Copyright © 2011-2022 走看看