• 为IE8添加EventListener系列方法支持


    在低版本IE中添加DOM元素事件可以使用attachEvent方法。但是用它模拟addEventListner还要解决一些问题。主动触发事件的API设计逻辑不同,需要处理的地方比较多。fireEvent也不支持自定义事件,还需要对自定义事件的储存和触发写额外的代码。

    <script src="ie8-eventlistener.js"></script>
    <script>
    document.addEventListener("test",function(){
    console.log("test");
    });
    var e=document.createEvent("Events");
    e.initEvent("test");
    document.dispatchEvent(e);
    </script>

    //ie8-eventlistener.js -[1,]||(function(){

    //为window对象添加 addEventListener=function(n,f){

        if("on"+n in this.constructor.prototype)

             this.attachEvent("on"+n,f);

        else {

             var o=this.customEvents=this.customEvents||{};

             n in o?o[n].push(f):(o[n]=[f]);

           };

         };

        removeEventListener=function(n,f){

           if("on"+n in this.constructor.prototype)

              this.detachEvent("on"+n,f);

          else {

             var s=this.customEvents&&this.customEvents[n];

             if(s)for(var i=0;i<s.length;i++)

                if(s[i]==f)return void s.splice(i,1);

           };

         };

         dispatchEvent=function(e){

            if("on"+e.type in this.constructor.prototype)

               this.fireEvent("on"+e.type,e);

          else {

              var s=this.customEvents&&this.customEvents[e.type];

              if(s)for(var s=s.slice(0),i=0;i<s.length;i++)  

                  s[i].call(this,e);

           }

          };

           //为document对象添加

           HTMLDocument.prototype.addEventListener=addEventListener;

           HTMLDocument.prototype.removeEventListener=removeEventListener;

          HTMLDocument.prototype.dispatchEvent=dispatchEvent;

          HTMLDocument.prototype.createEvent=function(){

            var e=document.createEventObject();

            e.initMouseEvent=function(en){this.type=en;};

            e.initEvent=function(en){this.type=en;}; return e; };

           //为全元素添加

           var tags=[

                  "Unknown","UList","Title","TextArea","TableSection","TableRow", "Table","TableCol","TableCell","TableCaption","Style","Span",    

                  "Select","Script","Param","Paragraph","Option","Object","OList", "Meta","Marquee","Map","Link","Legend","Label","LI","Input",  

                   "Image","IFrame","Html","Heading","Head","HR","FrameSet", "Frame","Form","Font","FieldSet","Embed","Div","DList",           "Button","Body","Base","BR","Area","Anchor"

      ],html5tags=[

          "abbr","article","aside","audio","canvas","datalist","details",    "dialog","eventsource","figure","footer","header","hgroup","mark",    "menu","meter","nav","output","progress","section","time","video"

    ],properties={

        addEventListener:{value:addEventListener},

        removeEventListener:{value:removeEventListener},

        dispatchEvent:{value:dispatchEvent}

      };

         for(var o,n,i=0;o=window["HTML"+tags[i]+"Element"];i++)

             tags[i]=o.prototype;

        for(i=0;i<html5tags.length;i++)

           tags.push(document.createElement(html5tags[i]).constructor.prototype);

        for(i=0;o=tags[i];i++)

         for(n in properties)Object.defineProperty(o,n,properties[n]);

     })();

  • 相关阅读:
    Unity3D脚本使用:物体调用物体
    Unity3D脚本使用:游戏对象访问
    Unity3D 浏览工具
    spring的工厂方法
    spring运用的设计模式
    Jquery ajax 与 lazyload的混合使用(实现图片异步加载)
    关于线程安全的一点总结
    lazyload的使用心得
    ajax原理及应用
    $.ajax和$.load的区别
  • 原文地址:https://www.cnblogs.com/ios9/p/5337905.html
Copyright © 2020-2023  润新知