封装事件绑定函数解决this在ie下的绑定问题

封装一个事件绑定函数

function addEven(obj,type,fn)
{
if(obj.attachEvent)
{
obj.attachEvent('on'+type,fn);
}
else
{
obj.addEventListener(type,fn,false);
}
}

在ie下弹出this的时候不会弹出标签对象本身，而是弹出window，先来看看call()方法：函数的调用如a();实际上等同于a.call();

例如有这样一个函数function a(){alert(this)} 这时结果是window，如果这样调用a.call('aaa');会弹出aaa，也就是说call里面的变量会改变函数this的值。

因此封装绑定函数就可以调用call，这样来做

function addEven(obj,type,fn)
{
if(obj.attachEvent)
{
   obj.attachEvent('on'+type,function(){
      fn.call(obj)//里面的this的值变成obj 变成当前调用的标签对象
    });
    }
else
{
   obj.addEventListener(type,fn,false);
}
}

再进一步用三目运算优化就可以这样做

function addEven(obj,type,fn)
{
return obj.attachEvent ? obj.attachEvent('on'+type,function(){fn.call(obj)}) : obj.addEventListener(type,fn,false);
}

搞定

转载于:https://www.cnblogs.com/thinksley/archive/2012/11/28/2792258.html

封装事件绑定函数解决this在ie下的绑定问题相关推荐

JavaScript封装一个注册函数解决兼容问题
我们知道JavaScript注册(绑定)事件主要有两类方式,第一类传统方式具有注册事件的唯一性,即对于同一元素的同一事件,不会出现两个处理函数,如下 var btn = document.queryS ...
JS之事件处理（一）--事件概述、非IE浏览器/IE浏览器中的事件绑定、解决浏览器事件绑定兼容性问题
一.概述描述:事件本质是一种交互操作,事件通常与函数配合使用,当事件发生时函数才会执行事件是由三部分组成的:事件源事件类型事件处理程序事件源:事件被触发的对象–谁事件类型:如何触发什么事 ...
js循环绑定事件问题及解决方法
js初学者经常遇到的循环绑定事件问题 js循环绑定事件在编写JS代码的时候,我们经常会遇到要对一系列元素进行事件绑定的情况,然后就会理所当然的开一个for循环,对元素的事件进行赋值等操作,最后运行的 ...
[vue] vue给组件绑定自定义事件无效怎么解决？
[vue] vue给组件绑定自定义事件无效怎么解决? 两种方式 1.组件外部加修饰符.navtive 2.组件内部声明$emit('自定义事件') 个人简介我是歌谣,欢迎和大家一起交流前后端知识.放 ...
html onblur 函数执行了2次,JavaScript“onblur事件”调用函数失效原因与解决方法
由于JavaScript事件有很多,例如: 鼠标事件:onclick 键盘事件:onkeydown.onkeypress 表单事件:onblur.onchange 窗口事件属性:onerror.onl ...
给动态动态生成元素绑定事件不生效解决方法
如题:动态生成的元素绑定事件后没有生效,或者说操作时没有效果 js,jq动态生成的元素,在绑定前,先一定要确认,执行绑定操作的时候,该元素是不是已经存在在页面上,也就是html上了,假如执行绑定的时候 ...
前端面试 - JS总结（1） - 基础 (数据类型, 事件与函数, 原型链)
你不走出舒适圈,又怎么知道自己多坚强?! 前端面试 - JS总结(1) - 基础 (数据类型, 事件与函数, 原型链) 前端面试 - JS总结(2) - ES6 (let, 箭头函数, this) 前 ...
ajax点击事件无法触发,解决jQuery Ajax动态新增节点无法触发点击事件的问题_婳祎_前端开发者...
在写ajax加载数据的时候发现,后面添加进来的demo节点元素,失去了之前的点击事件.为什么点击事件失效,我们该怎么去解决呢? 其实最简单的方法就是直接在标签中写οnclick="" ...
关于前台调用后台事件__doPostBack函数
关于前台调用后台事件__doPostBack函数作者:admin 日期:2006-04-11 字体大小: 小中大这里需要提一下的是,asp.net编程提供了服务端控件和客户端控件的说法,其实还 ...

封装事件绑定函数解决this在ie下的绑定问题

封装事件绑定函数解决this在ie下的绑定问题相关推荐

最新文章

热门文章