CODEWITHSUNDEEP
jquery
Mohan Ram
Mohan Ram

Reputation: 8463

Function triggering in jquery?

In My jquery function i used to trigger click function from li and img seperately but unfortunately when i click image. Click function for list also triggers

HTML CODE:

  <li id="list_id">List_text<img src='image.jpg' id="img_id"></li>

Jquery function:

$("#list_id").click(function(){
 alert('List is clicked');
});

$("#img_id").click(function(){
 alert('Image is clicked');
});

Once i click image both function triggers.

*Question:*I need to trigger only click function for image once i click image and to trigger click function for list once i click list

Upvotes: 0

Views: 52

Answers (3)

deceze
deceze

Reputation: 522635

$("#img_id").click(function(){
  alert('Image is clicked');
  return false;
});

Just return false from the function, which will prevent the event from bubbling up (among preventing other default actions, if that's what you want).

Upvotes: 0

kobe
kobe

Reputation: 15845

use event.stopPropagation();

     $("#img_id").click(function(){
             alert('Image is clicked');
  event.stopPropagation();
            });

Upvotes: 0

Darin Dimitrov
Darin Dimitrov

Reputation: 1039538

You need to stop the event propagation:

$("#img_id").click(function(evt){
    alert('Image is clicked');
    evt.stopPropagation();
});

Upvotes: 2

Related Questions