div onclick

Hi All,
I have a div like this -->

<div id="div_test" style="width:200px; background-color:#AAAAAA" onclick="location.href='aaaa.html';">
    <img src="images/spacer.gif" width="20"> this is the content

whenever user clicks the colored area, it will redirect him to aaaa.html
how can i do sth. like this --> if the user cilcks "the spacer.gif", the page won't be directed?

thanks a lot!
LVL 10
Who is Participating?
0h4crying0utloudConnect With a Mentor Commented:

I would use a separate event handler that find the target. note: The event handler assignment has to be made after the body tag.


<div id="div_test" style="width:200px; background-color:#AAAAAA" >
    <img id="img_test" src="spacer.jpg" width="20"> this is the content



function getTarget(e) {
      var target;
      if (!e) var e = window.event;
      if (e.target) target = e.target;
      else if (e.srcElement) target = e.srcElement;
      if (target.nodeType == 3) // defeat Safari bug
            target = target.parentNode;
      return target;

function handleOnClick(e) {
  var targetObj = getTarget(e);
      if (targetObj.id != "img_test") {
  return false;

document.getElementById("div_test").onclick = handleOnClick;

orbulatAuthor Commented:
thanks a lot!
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.