div onclick

Posted on 2006-05-28
Last Modified: 2006-11-18
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!
Question by:orbulat
    LVL 10

    Accepted Solution


    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 ( 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 ( != "img_test") {
      return false;

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

    LVL 10

    Author Comment

    thanks a lot!

    Write Comment

    Please enter a first name

    Please enter a last name

    We will never share this with anyone.

    Featured Post

    Training Course: Adobe Dreamweaver CC 2015

    Adobe Dreamweaver Creative Cloud is used by web designers and front-end developers and allows you to visualize your site in real-time as you code. This course covers exam objectives for the Adobe Certified Associate (ACA) certification.

    In my daily work (mainly using, I need to write a lot of JavaScript code. One of the most repetitive tasks I do are the jQuery Ajax calls. You know: (CODE) I don't know if for you it's the same, but for me is soooo tedious to write the …
    The task A number given should be formatted for easy reading by separating digits into triads. Format must be made inline via JavaScript, i.e., frameworks / functions are not welcome. So let’s take a number like this “12345678.91¿ and format i…
    The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
    The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

    760 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    7 Experts available now in Live!

    Get 1:1 Help Now