CODEWITHSUNDEEP
jquery
Kevin Brown
Kevin Brown

Reputation: 12650

jQuery: exclude class on click

//Table select
$("#reports-table tr").click(
    function() {
        var detail_id = $(this).attr('id');
        $(this).addClass("selected");
        $(this).siblings().removeClass("selected");
        $('#reports-right').show().load('/members/details/'+detail_id);
        $('#reports-table').width(680);
    }
);

I currently am using this code to add a selected class to a table row and show details of the row clicked in a right 'aside'. The problem is, I have action buttons in the row--when they are clicked, becausee they are children of the tr, this function still runs...

How can I exclude a certain class?

Upvotes: 1

Views: 1770

Answers (2)

John Hartsock
John Hartsock

Reputation: 86902

//Table select
$("#reports-table tr").click(
    function(evt) {
        if (!$(evt.target).hasClass(".yourClass")) {
          var detail_id = $(this).attr('id');
          $(this).addClass("selected");
          $(this).siblings().removeClass("selected");
          $('#reports-right').show().load('/members/details/'+detail_id);
          $('#reports-table').width(680);
        }
    }
);

Upvotes: 1

Nick Craver
Nick Craver

Reputation: 630637

You can check if the event.target matches a given selector and jump out, for example:

$("#reports-table tr").click(function(e) {
    if($(e.target).is(".actionButtonClass")) return;
    var detail_id = $(this).attr('id');
    $(this).addClass("selected");
    $(this).siblings().removeClass("selected");
    $('#reports-right').show().load('/members/details/'+detail_id);
    $('#reports-table').width(680);
});

Upvotes: 3

Related Questions