Internet Explorer and JavaScript event currentTarget

Internet Explorer and JavaScript event currentTarget

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 the this keyword to
refer to the object processing the event.
But in Internet Explorer we don’t have currentTarget property and the this refers to window object!
So how can I do that?

Solutions/Answers:

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 :

Related:  Count how many elements in a div

enter image description here

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.

Related:  Handlebars.js parse object instead of [Object object]

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.

Solution 6:

Additional note: Sometimes IE (like ie 7) will return undefined for event.target, so it won’t even evaluate it as true or false (whether in an if or in a ternary operator). Furthermore, even if you try typeof event.target == 'undefined' it will still error saying “event.target is undefined.” Which of course is stupid because that’s what you’re testing.
Apparently it is a problem with passing events into functions in older IE. What you do to fix it is:

event = event ? event : window.event;
if (typeof event.target == 'undefined') {
    var target = event.srcElement;
    } else {
    var target = event.target;
    }

Make note that you re-write the event in standards compliant browsers and grab the global event for IE.

Related:  Regex JavaScript image file extension [closed]

References