简要咨询咨询QQ网站导航网站搜索手机站点联系我们设为首页加入收藏 

详解javascript跨浏览器事件处理程序

来源:易贤网   阅读:923 次  日期:2016-07-15 16:25:02

温馨提示:易贤网小编为您整理了“详解javascript跨浏览器事件处理程序”,方便广大网友查阅!

本文为大家分享了javascript跨浏览器事件处理机制,供大家参考,具体内容如下

<!doctype html>

<html lang="en">

<head>

  <meta charset="UTF-8">

  <title>跨浏览器的事件处理程序</title>

</head>

<body>

  <input type="button" value="click me" id="myBtn"/>

  <input type="button" value="解除" id="unlisten"/>

  <script>

    function $(id){

      return document.getElementById(id);

    }

    var EventUtil={

      fnCount:0

      ,fnData:{}

      ,addHandler:function(element,type,handler){

        this.fnCount++;

        handler.fid = this.fnCount;

        var _fn = handler;

        handler = function(){

          _fn.call(element);

        };

        this.fnData[this.fnCount] = handler;

        if(element.addEventListener){

          element.addEventListener(type,handler,false);

        }  else if(element.attachEvent){

          element.attachEvent("on"+type,handler);

        }  else {

          element["on"+type]=handler;

        }

      }

      ,removeHandler:function(element,type,handler){

        handler = this.fnData[handler.fid];

        if(element.removeEventListener){

            element.removeEventListener(type,handler,false);

        }else if(element.detachEvent){

            element.detachEvent("on"+type,handler);

        }else{

            element["on"+type]=null;

        }

      }

    }

    var btn=$("myBtn");

    var unbtn = $('unlisten');

    var bindFn1=function(){

      alert(this.id);

    };

    var bindFn2=function(){

      alert('2');

    };

    EventUtil.addHandler(btn,"click",bindFn1);

    EventUtil.addHandler(btn,"click",bindFn2);

    //EventUtil.removeHandler(btn,"click",bindFn1);

    EventUtil.addHandler(unbtn,"click",function(){

      EventUtil.removeHandler(btn,"click",bindFn1);

    });

  </script>

</body>

</html>

以上就是本文的全部内容,希望对大家的学习有所帮助。

更多信息请查看网络编程
点此处就本文及相关问题在本站进行非正式的简要咨询(便捷快速)】     【点此处查询各地各类考试咨询QQ号码及交流群
上一篇:Bootstrap每天必学之级联下拉菜单
下一篇:js事件处理程序跨浏览器解决方案
易贤网手机网站地址:详解javascript跨浏览器事件处理程序
由于各方面情况的不断调整与变化,易贤网提供的所有考试信息和咨询回复仅供参考,敬请考生以权威部门公布的正式信息和咨询为准!