Home/ Questions/Q 1055773
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-16T17:36:52+00:00

I have an anchor link inside a div. I would like both the anchor

  • 0

I have an anchor link inside a div. I would like both the anchor link and div to process onclick events separately, but right now clicking on the anchor link also triggers the onclick event for the div. How do I prevent this?

Here’s the code:

<html>
     <head>
     <style>
     #box {
          background-color: #ccffcc;
          width: 400px;
          height: 200px;
     }
     </style>
     <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js">
     </script>
     <script type="text/javascript">
          $(document).ready(function() {
               $("#mailto").click(function(event) {
                    // correctly opens an email client if clicked
                    $("a[@href^='http']").attr('target','_blank');
                    return( false );
               });

               $("#box").click(function() {
                    // always goes to the home page, even if the #mailto id is clicked
                    window.location = '/index.php';
               });
          });
     </script>
     </head>
     <body>
     <div id="box">
          <a  href="mailto:someone@psomewhere.com" id="mailto">someone@psomewhere.com
    </div>
     </body>
</html>

Is there a way for me to stop execution of the code after the mailto is loaded?

Thanks!

John

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    you need to make sure your html is valid, so finish the a tag off:

    <a href="mailto:someone@psomewhere.com" id="mailto">someone@psomewhere.com<a/>

    and if that still causes problems try this.

    $("#mailto").click(function(event)
{
    event.stopPropagation();
    if(event.srcElement == 'HTMLAnchorElement')
    { 
        //Process
    }
});
    • 0