jQuery events priority when element within an element is clicked -


<script> $(document).ready(function()   {   $("a").click(function(){    alert("anchor clicked !")  });    $("p").click(function(){    alert("p clicked !")  });  }); </script> </head> <body> <a href = "#"><p>click me ! </p> </a> </body> </html> 

when click on link first alert("p clicked !") , alert("anchor clicked !") appears.

i want know behaviour observed ?

p.s. : couldn't come appropriate title edit welcome

this due event bubbling

when use event bubbling

                               / \ ---------------| |----------------- | element1     | |     tag      | |   -----------| |-----------     | |   |element2  | |    p  tag      | |   -------------------------     | |        event bubbling           | ----------------------------------- 

read what event bubbling , capturing?

to prevent event bubbling

use event.stoppropagation

jsfiddle demo


Comments

Popular posts from this blog

c++ - CryptStringToBinary API behavior -

c++ - Correct method for redrawing a layered window -

java.util.scanner - How to read and add only numbers to array from a text file -