Internet Explorer and JavaScript event currentTarget
Solution 1
You can do something like
target = (event.currentTarget) ? event.currentTarget : event.srcElement;
Although as @Marc mentioned you can use a JQuery framework that normalizes the event for you.
Solution 2
I had similar problem. I solved it using keyword this
as stated in an article on brainjar.com
To get the equivalent of the currentTarget property in IE, use the this keyword as an argument when setting the event handler in a tag.
...
function myHandler(event, link) { ... }
On the same page you can find the following table :
Solution 3
The short answer is: use jQuery.
Although event.currentTarget
is not accessible on IE, jQuery will normalize the event for you so your code would also work on IE (as stated here)
Note that using event.srcElement
, as suggested in other answers is not equivalent, since srcElement
corresponds to the target
, not to currentTarget
, as explained at the end of this page.
Solution 4
with this function you can pass the object when adding and get it in the listener. the problem about this is that you have an anonymous function as eventlistener and in actionscript you cannot remove an anonymous listener. dunno bout 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);
}
its my framework and i call it jNoob.
Solution 5
I'm assuming that you're wanting to use the 'this' context because the same handler will be dealing with multliple posible objects. In that case, see the excellent AddEvent script from the quirksmode recoding contest. (http://www.quirksmode.org/blog/archives/2005/09/addevent_recodi.html). This code has allowed me to get the very last of my javascript out of html. More importantly, it seems to work on all of the browsers that I've tested. Simple and compact.
Related videos on Youtube
Comments
-
xdevel2000 about 4 years
Is there a way to take the current target of an event with IE 7 or 8?
With other browser (firefox, opera, chrome etc.) we can use
event.currentTarget
or also we can use thethis
keyword to refer to the object processing the event.But in Internet Explorer we don't have
currentTarget
property and thethis
refers to window object!So how can I do that?
-
xdevel2000 about 15 yearsyes I did it. But no answer founded...it seems that IE simply does not support that important feature (also IE 8) and every time I must develop with that browser the NIGHTMARES begin!
-
Russ Cam about 15 yearsyou could always go down the JavaScript framework route like jQuery, Prototype, etc... to abstract the differences away
-
Loek Bergman over 5 yearsIt is more than nine years later and jQuery still does not guarantee in the API-documentation that event.currentTarget will work as expected. When even they do not accomplish it after so many years, it is an impossible feat.
-
-
alvincrespo over 13 yearsThis is not an answer to the question. And it doesn't offer any solutions. :(
-
Marc-André Lafortune about 13 years@alvincrespo: How is my first line ("Use jQuery") not a solution? If the OP uses jQuery, he will be able to use
event.currentTarget
on IE 7/8, as per his request. -
alvincrespo about 13 yearsI guess it is an answer but I was under the assumption that @xdevel2000 was asking for a pure JS answer. I apologize for any misunderstanding and not explaining my comment.
-
alvincrespo about 13 yearsReference for srcElement: msdn.microsoft.com/en-us/library/ms534638(v=vs.85).aspx
-
Marc-André Lafortune about 13 years@alvincrespo: No problem. It is nice that you give a pure JS answer (you got my upvote :-). I'll stick with my opinion that cross browser subtleties are best handled through existing solutions (e.g. jQuery) than figuring out where it doesn't work and bypassing the issue "by hand".
-
Galled almost 13 yearsUseful but incomplete. Reading here ( howtocreate.co.uk/tutorials/javascript/eventinfo ) I found out that you have to put "if(window.event){ event = window.event; }" before your code.
-
alvincrespo almost 13 yearsHmm. Interesting, that link would definitely help out in understanding browsers older than most current ones and if they run in quirks mode.
-
David Hellsing over 12 yearsThat’s not correct, event.srcElement equals event.target. event.currentTarget is something else and is more difficult to normalize.
-
Farray over 12 yearsI know this is old but downvoted as the jQ route requires the event to be passed to the function. As far as getting the event target without explicitely passing the event object to the function, alvincrespo's method is the only way that I'm aware of.
-
Marc-André Lafortune over 12 years@Farray: tks. Is it the same, though? As @David comments,
srcElement == target
, notcurrentTarget
. See also end of quirksmode.org/js/events_order.html -
Marc-André Lafortune over 12 yearsLooks like @David is right, see the end of quirksmode.org/js/events_order.html
-
Farray over 12 years@Marc Thanks for the reply -- I totally missed that and David/you are correct.
-
alvincrespo over 12 yearsHmm interesting, what would you recommend to normalize it @David/@Marc?
-
David Hellsing over 12 years@alvincrespo it depends, if you don’t need to remove the listener you can just bring in the element into the callback using an anonymous function and .call() since e.currentTarget == bound element. Otherwise I would save the callbacks in an array or use a good event lib like found in jQuery, YUI or independent libs ( I use my own called 2k.js ).
-
jhsowter almost 12 yearsI think this answer is wrong. srcElement is the original source of the event, not necessarily the current target.
-
Hogan over 11 yearsReally? You think "those jQuery guys" don't want people to know this? Their code is open source, I expect Resig does not care.
-
Ignas2526 over 11 yearsReally? So why I'm the only one who wrote such solution here?
-
Hogan over 11 yearsIt looks almost the same as anas' answer to me. But if you are paranoid and want a us vs them situation, feel that way :D
-
Ignas2526 over 11 yearsNot what I want to do that, but everywhere where I look, I see Jquery. It feels like soon people will not be able to hide a div by id without Jquery.
-
Hogan over 11 yearsVery very true... there is an on-going joke / meme on Meta and other places about how every javascript question's answer starts with "Use jQuery and..." However, this question was not about jQuery and there is an attempt on SO to not have POV questions or answers. There is nothing interesting or relevant about bashing the "jQuery guys". That was my point.
-
Chris Middleton over 9 yearsNote that event.target refers to the element the event was fired on, whereas event.currentTarget (the one in the question) is the element the event is being handled by, i.e. the one you set the handler on. The event.target element is the innermost element, for example, in a click event. See here: javascript.info/tutorial/bubbling-and-capturing.
-
MrBoJangles about 5 yearsSince the small script that I'm dealing with was already using jquery, I simply replaced
$(e.currentTarget)
with$(this)
. If you're in with jquery, go all-in.