Clever Geek Handbook

Why can't I lock the mouse click in IE?

I have a page with a rectangular area with text and icons in it, all clickable. The anchor label is set to display: block. One of the icons has an onclick handler. If a person clicks on the icon, I just want the icon's onclick handler to fire and not actually activate the containing anchor tag.

Firefox behaves the way I want it, IE doesn't.

So, I tried to capture the event in the onclick handler:

function my_onclick_handler(evt){
  if (!evt) evt = window.event;

  // ... handle the click

  if (evt.stopPropagation) evt.stopPropagation();
  evt.cancelBubble = true;
}

It didn't work, so I thought maybe it's actually the onmouseup or onmousedown events that fire the anchor tag, so I added a clickSwallow method for the onmouseup and onmousedown methods:

function clickSwallow(evt){
  if (!evt) evt = window.event;
  if (evt.stopPropagation) evt.stopPropagation();
  evt.cancelBubble = true;
}

It didn't work either. Any ideas on how to get the containing anchor to respond to a click in this case?

+1


source to share


3 answers


I would just use <span>

, but I think returning false

from an event handler should do the trick as well.



+3


source


There are a few elements in this post that you don't have (like e.returnValue and e.preventDefault), but from the text it appears that are FF specific functions. It might be worth taking a picture.



+1


source


Try changing the binding to:

<a href="javascript:void(0)"> <img src="..." onclick=".."> </a>
0


source






More articles:


All Articles