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版本终于问世 ...
随机推荐
- 什么是CAS机制?(转)
围绕下面四个点展开叙述: 一:什么是CAS机制? 二:Java当中CAS的底层实现 三:CAS的ABA问题和解决方法 四:java8对CAS的优化 一:什么是CAS机制? 我们先看一段代码: 启动两个 ...
- 为App添加Log日志文件
using System; using System.Globalization; using System.IO; using System.Text; using System.Windows.F ...
- 【tool】VLC播放rtmp协议
您的输入无法被打开: VLC 无法打开 MRL「rtmp://112.35.3.71:47201/api/6276-0.1546939632724.flv」.详情请检查日志.
- vue上传图片 base64+canvas压缩图片
这是先将图片 base64转码 在拿canvas压缩的
- 使用Docker安装Oracle数据库
在很多时候,我们需要在本地安装Oracle数据库,但是整个安装的过程时间非常长而且安装文件大,那么有不有更好的办法来安装Oracle数据库既能减少安装的时间而且还能够快速进行部署呢?答案就是使用Doc ...
- CentOS_7下安装PHP7.3
安装mysql:https://www.cnblogs.com/jiangml/p/10402390.html 下载PHP安装包: 官网:http://www.php.net/downloads.ph ...
- 洛谷 P1903 [国家集训队]数颜色 / 维护队列
墨墨购买了一套N支彩色画笔(其中有些颜色可能相同),摆成一排,你需要回答墨墨的提问.墨墨会向你发布如下指令: 1. \(Q\) \(L\) \(R\) 代表询问你从第L支画笔到第R支画笔中共有几种不同 ...
- CF1157C1-Increasing Subsequence (easy version)题解
原题地址 题目大意:
- 小计:Shopee批量删除修复~附脚本
需求 昨天浪的时候,无意之间看到文职人员在一个个删除违禁商品,大概23个店铺,每个店铺500多个商品,页面是用Ajax异步加载的,每删一个就需要等几秒,粗略估计一下用时:9h左右 然后了解了下是什么情 ...
- chrome主页篡改解决方法
网上有一个超级细致的小白教学连接,但是发现很难找到,分享一下:https://arlenluo.github.io./2017/03/12/DefeatYourBrowser 还有一种情况是要打开 & ...