Page 1 of 1

Capturing events in IE

Posted: Tue Jul 14, 2009 2:32 pm
by kendall
Ok... No I have been researching and I see that IE is a real pain in the ass. I have a html markup

Code: Select all

 
<a href=""><img src=""/></a>
 
and I'm using an addEventListener/ attachEvent on to the <a> for a click event. Now while FF/ Opera and Chrome gives me the <a> tag....IE is giving me the <img> tag

I have used the whole cancelBubble = true and returnValue = false but I can't seem to figure out how to get the <a> in IE (7).

anyone with some insight workarounds?

Re: Capturing events in IE

Posted: Tue Jul 14, 2009 4:43 pm
by pickle
I don't think you want to cancel the bubble - bubbling is what's firing the event in the first place.

It's hard to give solid advice without seeing more detail, but maybe check the event closer & see if there's some aspect of the event that maps to the <a>. It's entirely possible that there's one property that maps to what triggered the event (the image) and one property that maps to what acted on the event (the <a>).

Re: Capturing events in IE

Posted: Wed Jul 15, 2009 9:35 pm
by JAB Creations
This should work just fine in IE...

Code: Select all

<element onclick="alert(this.id);" />
...then replace alert with a custom function...and alert the id...

Code: Select all

<element onclick="my_function(event);" />
...if IE is giving you the img element then use the W3C DOM to access it's parentNode. :wink:

Good tutorial for JavaScript nodes here: http://www.howtocreate.co.uk/tutorials/ ... /dombasics

Re: Capturing events in IE

Posted: Fri Jul 17, 2009 12:37 pm
by spider.nick
JAB Creations wrote:This should work just fine in IE...

Code: Select all

<element onclick="alert(this.id);" />
...then replace alert with a custom function...and alert the id...

Code: Select all

<element onclick="my_function(event);" />
...if IE is giving you the img element then use the W3C DOM to access it's parentNode. :wink:

Good tutorial for JavaScript nodes here: http://www.howtocreate.co.uk/tutorials/ ... /dombasics
But, and this is only preference at this point, separating out your JavaScript from your HTML is a better practice.

So, in your JavaScript file, you might do something like this:

Code: Select all

 
window.onload = function() {
var a_tags = document.getElementsByClassName('class_name');
 
// For legit browsers
a_tags.addEventListener( 'click', functionName , false );
 
// For IE
a_tags.attachEvent( 'onclick', functionName )
}
 
Nick