Internet Explorer和JavaScript事件currentTarget
有没有一种方法来采取IE 7或8事件的当前目标?
使用其他浏览器(firefox,opera,chrome等),我们可以使用event.currentTarget
,也可以使用this
关键字来引用处理事件的对象。
但在Internet Explorer中,我们没有currentTarget
属性,而this
指的是窗口对象!
那我该怎么做呢?
你可以做类似的事情
target = (event.currentTarget) ? event.currentTarget : event.srcElement;
虽然@Marc提到你可以使用一个JQuery框架来为你规范事件。
我有类似的问题。 我使用关键字解决了this
问题,正如brainjar.com上的一篇文章所述
要在IE中获得currentTarget属性的等价物,请在设置标记中的事件处理函数时使用this关键字作为参数。
…
函数myHandler(event,link){…}
在同一页面上可以find下表:
简短的答案是:使用jQuery。
虽然event.currentTarget
不能在IE浏览器上访问,但jQuery会为你规范化事件,所以你的代码也可以在IE上运行(如此处所述)
请注意,使用event.srcElement
,正如其他答案中的build议是不等价的,因为srcElement
对应于target
,而不是currentTarget
,如本页末尾所述。
使用这个函数,你可以在添加并传入侦听器时传递对象。 关于这个问题是你有一个匿名函数作为eventlistener和在脚本中你不能删除一个匿名监听器。 不知道回合js。
addEvent:function(object,type,listener,param) { if(object.addEventListener) object.addEventListener(type, function(e){ listener(object, e, param);}, false ); else if(object.attachEvent) object.attachEvent('on'+type, function(e){ e = getEvent(e); listener(object, e, param);}); }, getEvent:function(e) { if(!e) e = window.event; // || event if(e.srcElement) e.target = e.srcElement; return e; }, removeEvent:function(object,type,listener) { if(object.removeEventListener) object.removeEventListener(type, listener, false); else object.detachEvent('on'+type, listener); } var div = document.getElementById('noobsafediv'); var div2 = document.getElementById('noobsafediv2'); addEvent(div,'mouseover',mouseover,['astring',111,div2]); function mouseover(object,e,param) { console.log(object,e,param); }
我的框架,我称之为jNoob。
我假设你想要使用“this”上下文,因为同一个处理程序将处理多个可能的对象。 在这种情况下,请参阅quirksmode recoding比赛中出色的AddEvent脚本。 ( http://www.quirksmode.org/blog/archives/2005/09/addevent_recodi.html )。 这段代码让我得到了HTML的最后一个javascript。 更重要的是,它似乎适用于我testing过的所有浏览器。 简单而紧凑。
附加说明:有时IE(如ie 7)将返回未定义的event.target,所以它甚至不会评估它为true或false(无论是否在三元运算符)。 而且,即使你尝试使用typeof event.target == 'undefined'
,仍然会报错“event.target未定义”。 这当然是愚蠢的,因为这就是你正在testing。
显然这是一个将事件传递到旧IE中的函数的问题。 你做什么来解决它是:
event = event ? event : window.event; if (typeof event.target == 'undefined') { var target = event.srcElement; } else { var target = event.target; }
请注意,您在符合标准的浏览器中重写事件,并获取IE的全局事件。
用Prototype JS你可以使用:
var target = Event.element(event);
Internet Explorer 6-8不执行event.currentTarget。
从Mozilla开发者networking报价:
在Internet Explorer 6到8上,事件模型是不同的。 事件侦听器附有非标准的element.attachEvent方法。 在这个模型中,没有等同于event.currentTarget,这是全局对象。 模拟event.currentTargetfunction的一个解决scheme是使用Function.prototype.call将元素作为第一个参数,将您的处理程序封装在调用处理程序的函数中。 这样,这将是预期的价值。
如果您仍然使用jQuery ,那么jQuery负责规范事件对象及其属性(如其他答案中所述)。 从jQuery API文档引用:
jQuery的事件系统根据W3C标准规范事件对象。
这个函数创buildcurrentTarget
,如果它是IE,所以你不再需要修补你的代码!
function eventListener(e,t,f) { if(e.addEventListener) e.addEventListener(t,f); else e.attachEvent('on' + t, function(a){ a.currentTarget = e; f(a); }); }
普通的JS(不会在IE下9以上):
function myfunction(e) { alert(e.currentTarget.id); } e = document.getElementById('id'); e.AddEventListener(e,'mouseover',myfunction);
有了这个function(将工作在IE 9以下):
function myfunction(e) { alert(e.currentTarget.id); } e = document.getElementById('id'); eventListener(e,'mouseover',myfunction);
currentTarget属性是从IE版本9开始支持的。
在IE9 +中试试这个例子
我想给出一个更简单的答案,这个肉和anas中的肉一样,user1515360的答案是:
if (browserDoesNotUnderstandCurrentTarget) { someElement.onclick = function (e) { if (!e) { var e = window.event; } e.currentTarget = someElement; yourCallback(e); } } else { someElement.onclick = yourCallback; }
当然,你可以用onclickreplace你想要的任何事件。
这使e.currentTarget在不支持currentTarget的浏览器上可用。
以及即时消息不知道,但这可能是一个解决scheme:由于srcElement给出的子元素不应该有一个事件,因为这将干预事件的父元素,没有任何其他上层元素事件陈述(像onmosedown =“”),所以这是代码:
if (!event) event = window.event; if (event.currentTarget) element = event.currentTarget; else{element = event.srcElement; while(element.onmousedown==null) element = element.parentNode;} if(element.nodeType==3) element=element.parentNode; // defeat Safari bug
这似乎工作得很好,直到现在与我请纠正我,如果你发现一个问题,因为我需要一个解决scheme,我不想使用jQuery ..
您始终可以使用闭包并传递事件处理程序已附加到的元素。 沿着这些线路的东西…
function handlerOnClick (currentTarget) { return function () { console.log(currentTarget); } } var domElement = document.createElement('DIV'); domElement.innerHTML = 'Click me!'; domElement.onclick = handlerOnClick(domElement); document.body.appendChild(domElement);