当前位置: 移动技术网 > IT编程>开发语言>JavaScript > IE兼容事件绑定V1.0

IE兼容事件绑定V1.0

2019年04月10日  | 移动技术网IT编程  | 我要评论

想要兼容ie678,少用原型,因为它们没有完全实现ecma-262规范

 

 1 (function(window){
 2     //兼容ie678时少用原型,因为它没有完全遵循ecma-262规范
 3     
 4     //衬垫代码:isarray方法的兼容方案
 5     if (!array.isarray) {
 6       array.isarray = function(arg) {
 7         return object.prototype.tostring.call(arg) === '[object array]';
 8       };
 9     }
10     
11     //衬垫代码:every数组过滤方法的兼容方案
12     if (!array.prototype.every){
13       array.prototype.every = function(fun /*, thisarg */)
14       {
15         'use strict';
16     
17         if (this === void 0 || this === null)
18           throw new typeerror();
19     
20         var t = object(this);
21         var len = t.length >>> 0;
22         if (typeof fun !== 'function')
23             throw new typeerror();
24     
25         var thisarg = arguments.length >= 2 ? arguments[1] : void 0;
26         for (var i = 0; i < len; i++)
27         {
28           if (i in t && !fun.call(thisarg, t[i], i, t))
29             return false;
30         }
31     
32         return true;
33       };
34     }
35     
36     var bear = {
37         //该函数是一个全兼容的事件绑定函数,但只能处理一个事件回调函数
38         addlistener: function(node,name,fn){    
39             if(node.addeventlistener){
40                 node.addeventlistener(name,fn);
41             }else{
42                 node.attachevent("on"+name,function(){
43                     fn.call(node);
44                 })
45             }
46         },
47     
48         //该函数是一个全兼容的事件绑定函数,能处理一个回调数组
49         addmorelistener: function(node,name,arr){
50             if(typeof arr === "function"){
51                 bear.addlistener(node,name,arr);
52             }else if(array.isarray(arr)&&arr.length){                        
53                 if(node.addeventlistener){
54                     
55                 }else if(node.attachevent){
56                     arr = arr.reverse();
57                 }                        
58                 var flag = arr.every(function(item){
59                     return typeof item === "function";
60                 })    
61                 if(flag){
62                     for(var i=0;i<arr.length;i++){
63                         bear.addlistener(node,name,arr[i]);
64                     }
65                 }else{
66                     throw new error("数组内元素类型有误");
67                 }
68             }else{
69                 throw new error("第三参数类型有误或为空数组");
70             }                    
71         }    
72     }
73     
74     window.bear = bear;
75 })(window)

 

测试代码

 1 <!doctype html>
 2 <html>
 3     <head>
 4         <meta charset="utf-8">
 5         <title></title>
 6         <style>
 7             *{
 8                 margin: 0;
 9                 padding: 0;
10             }
11             #app{
12                 width: 100px;
13                 height: 100px;
14                 background: #f4a460;
15                 position: absolute;
16                 left: 0;
17                 right: 0;
18                 bottom: 0;
19                 top: 0;
20                 margin: auto;
21                 font: 20px/100px helvetica;
22                 text-align: center;
23                 
24             }
25         </style>
26         
27         
28         <script src="./js/bear-extend-event2.js"></script>
29         <script>
30             window.onload = function(){                
31                                 
32                 var appnode = document.getelementbyid("app");        
33                 var arr = [function(){console.log(1);},function(){console.log(2);}]
34                 //debugger
35                 bear.addmorelistener(appnode,"click",arr);
36             }
37         </script>
38     </head>
39     <body>
40         <div id="app">app</div>            
41     </body>
42 </html>

 

如对本文有疑问, 点击进行留言回复!!

相关文章:

验证码:
移动技术网