How do I prevent default checkbox event from overriding my jQuery check/uncheck function?

checkbox, jquery

Solution

You can use `event.stopPropagation` to avoid your `input#myContacts`'s click event propagates to the `tr`'s click event. Also, I can't believe you are mixing jQuery and DOM in that way yet, when you should be using jQuery Events.

$(document).ready(function(){
  $("input#myContacts").click(function(e){
    e.stopPropagation();
  });
});

Problem

I have a list of checkboxes inside a table with a simple jQuery function that allows the user to click anywhere in the table row to check/uncheck the checkbox. It works great, except when the user actually clicks on the checkbox. It doesn't work then. Any ideas? Here is my code: HTML: ``` <tr onClick="checkBox()">...</tr> ``` jQuery: ``` function checkBox() { var ischecked = $('input#myContacts').attr("checked"); if(ischecked) { $('input#myContacts').attr("checked", false); } else { $('input#myContacts').attr("checked", true); } return false; } ```

Original source