CODEWITHSUNDEEP
jquery
kkh
kkh

Reputation: 4869

Two click events tied to one element

I have a anchor tag which has a img tag inside. when I click on the img, an event happens. However, I have another click event tagged to the anchor tag as well, so how do I prevent the click event on the anchor click on the img click?

<a class="rfi btn btn-inverse"><img class="delete"/></a>

my click events are done using jquery.

Upvotes: 0

Views: 150

Answers (3)

Dimitar
Dimitar

Reputation: 484

try this:

$("your img selector").click(function (event) {
    event.stopPropagation();
});

Upvotes: 1

karim79
karim79

Reputation: 342625

Stop the click on the image from bubbling up and triggering its parent's click handler:

$("img").on("click", function (e) {
    e.stopPropagation();
});

Upvotes: 2

T.J. Crowder
T.J. Crowder

Reputation: 1074028

You do that by stopping "propagation" (bubbling) from the img to the a, via Event#stopPropagation. So:

$("selector for your img elements").click(function(e) {
    e.stopPropagation();

    // -- Your img click code here --
});

(return false from the event handler will also do it, but will also prevent any default action. Mind you, there is no default action for click on an img element, so it would be fine in this case.)

Upvotes: 1

Related Questions