IE兼容事件绑定V1.0
想要兼容IE678，少用原型，因为它们没有完全实现ECMA-262规范
(function(window){
//兼容IE678时少用原型，因为它没有完全遵循ECMA-262规范
//衬垫代码：isArray方法的兼容方案
if (!Array.isArray) {
Array.isArray = function(arg) {
return Object.prototype.toString.call(arg) === '[object Array]';
};
}
//衬垫代码：every数组过滤方法的兼容方案
if (!Array.prototype.every){
Array.prototype.every = function(fun /*, thisArg */)
{
'use strict';
if (this === void 0 || this === null)
throw new TypeError();
var t = Object(this);
var len = t.length >>> 0;
if (typeof fun !== 'function')
throw new TypeError();
var thisArg = arguments.length >= 2 ? arguments[1] : void 0;
for (var i = 0; i < len; i++)
{
if (i in t && !fun.call(thisArg, t[i], i, t))
return false;
}
return true;
};
}
var bear = {
//该函数是一个全兼容的事件绑定函数，但只能处理一个事件回调函数
addListener: function(node,name,fn){
if(node.addEventListener){
node.addEventListener(name,fn);
}else{
node.attachEvent("on"+name,function(){
fn.call(node);
})
}
},
//该函数是一个全兼容的事件绑定函数，能处理一个回调数组
addMoreListener: function(node,name,arr){
if(typeof arr === "function"){
bear.addListener(node,name,arr);
}else if(Array.isArray(arr)&&arr.length){
if(node.addEventListener){
}else if(node.attachEvent){
arr = arr.reverse();
}
var flag = arr.every(function(item){
return typeof item === "function";
})
if(flag){
for(var i=0;i<arr.length;i++){
bear.addListener(node,name,arr[i]);
}
}else{
throw new Error("数组内元素类型有误");
}
}else{
throw new Error("第三参数类型有误或为空数组");
}
}
}
window.bear = bear;
})(window)
测试代码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
*{
margin: 0;
padding: 0;
}
#app{
width: 100px;
height: 100px;
background: #F4A460;
position: absolute;
left: 0;
right: 0;
bottom: 0;
top: 0;
margin: auto;
font: 20px/100px helvetica;
text-align: center; }
</style> <script src="./js/bear-extend-event2.js"></script>
<script>
window.onload = function(){ var appNode = document.getElementById("app");
var arr = [function(){console.log(1);},function(){console.log(2);}]
//debugger
bear.addMoreListener(appNode,"click",arr);
}
</script>
</head>
<body>
<div id="app">app</div>
</body>
</html>
IE兼容事件绑定V1.0的更多相关文章
- ie低版本内核事件兼容问题（事件绑定，绑定事件自动执行，文档模式问题）
问题情况 搜狗等,兼容模式下,以前前端写的点击事件的代码没有, 后来一看是因为兼容模式为9,导致点击事件失效 解决办法,步骤 1,处理绑定事件兼容问题 ie低版本绑定事件只支持attactevent, ...
- 兼容IE9以下和非IE浏览器的原生js事件绑定函数
事件绑定函数的demo如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "htt ...
- 兼容8事件绑定与解绑addEventListener、removeEventListener和ie的attachEvent、detachEvent
兼容8事件绑定与解绑addEventListener.removeEventListener和ie的attachEvent.detachEvent ;(function(){ // 事件绑定 bi ...
- jQuery 2.0.3 源码分析 事件绑定 - bind/live/delegate/on
事件(Event)是JavaScript应用跳动的心脏,通过使用JavaScript ,你可以监听特定事件的发生,并规定让某些事件发生以对这些事件做出响应 事件的基础就不重复讲解了,本来是定位源码分析 ...
- JS中的事件绑定，事件捕获，事件冒泡以及事件委托，兼容IE
转载请注明出处:http://www.cnblogs.com/zhangmingze/p/4864367.html ● 事件分为三个阶段: 事件捕获 --> 事件目标 --> ...
- 事件绑定，事件捕获，事件冒泡以及事件委托，兼容IE
● 事件分为三个阶段: 事件捕获 --> 事件目标 --> 事件冒泡 ● 事件捕获:事件发生时(onclick,onmouseover……)首先发生在document上,然后依次传 ...
- JS+Zero Clipboard swf复制到剪贴板 兼容浏览器(bind事件绑定函数)
转自http://www.ipmtea.net/css_ie_firefox/201107/07_499.html 1.ZeroClipboard其实是国外的一个js类库,源码结构如: var Zer ...
- Omi v1.0震撼发布 - 令人窒息的Web组件化框架
原文链接--https://github.com/AlloyTeam/omi 写在前面 Omi框架经过几十个版本的迭代,越来越简便易用和强大. 经过周末的连续通宵加班加点,Omi v1.0版本终于问世 ...
- Omi v1.0震撼发布 - 开放现代的Web组件化框架
原文链接--https://github.com/AlloyTeam/omi 写在前面 Omi框架经过几十个版本的迭代,越来越简便易用和强大. 经过周末的连续通宵加班加点,Omi v1.0版本终于问世 ...
随机推荐
- Django（九）下：Ajax操作、图片验证码、KindEditor使用
三.Ajax操作 ajax操作基于浏览器的xmlHttpRequest对象,IE低版本是另外一个对象,jQuery 1 版本对那两个对象做了封装,兼容性最好,2 .3版本不再支持IE低版本了. Aja ...
- mysql union 与 union all 语法及用法
1.mysql union 语法 mysql union 用于把来自多个select 语句的结果组合到一个结果集合中.语法为: select column,......from tabl ...
- TCP/IP协议、UDP协议、 Http协议
开放式系统互联通信参考模型(Open System Interconnection Reference Model,缩写为 OSI),简称为OSI模型(OSI model),一种概念模型,由国际标准化 ...
- Manifest merger failed : Attribute application@icon value=(@mipmap/ic_launcher) from AndroidManifest
情况是这样子的,导入一个比较老的项目(两年前),它依赖于一个 Libraray,已经先导入了 library,现在导入项目的时候出了错 (1) Android Studio 目前提供将 SDK包成 . ...
- 关于String的一些基础小题目
需求一:从键盘输入一串字符串,统计数字,字母,空格,其它字符的个数 import java.util.Scanner; public class Q1 { public static void mai ...
- 「Algospot」量化QUANTIZE
一道不难的DP题,主要是为了总结这类最优化题的思路:同时还学到了一个新操作 传送门:$>here<$ 题意 给出一个长度为$N$的序列,要求最多使用s个数字进行量化(有损压缩),即代替原数 ...
- freeCodeCamp中一些有趣的方法
1. 过滤对象(找到数组中(collection)与之(source)匹配对象,过滤掉数组中(collection)不匹配对象) function where(collection, source) ...
- POJ1988 Cube stacking(非递归)
n有N(N<=30,000)堆方块,开始每堆都是一个方块.方块编号1 – N. 有两种操作: nM x y : 表示把方块x所在的堆,拿起来叠放到y所在的堆上. nC x : 问方块x下面有多少 ...
- 【集训队互测2015】Robot
题目描述 http://uoj.ac/problem/88 题解 维护两颗线段树,维护最大值和最小值,因为每次只有单点查询,所以可以直接在区间插入线段就可以了. 注意卡常,不要写STL,用链表把同类修 ...
- Docker Dockerfile
镜像的定制实际上就是定制每一层所添加的配置.文件.如果我们可以把每一层修改.安装.构建.操作的命令都写入一个脚本,用这个脚本来构建.定制镜像,那么之前提及的无法重复的问题.镜像构建透明性的问题.体积的 ...