Checkbox is unclickable inside div that has onclick listener

I开发者_StackOverflow中文版 have a checkbox inside a div that has an onclick javascript event attached to it.

When I click on the checkbox, the onclick event is fired, instead of the checkbox being checked.

Any ideas on how to fix this behaviour?

Thanks

You can try to change your code (in the jsfiddle.net example) to something like this:

$(function() {
    $('#click').click(function(event) {
        var $target = $(event.target);
        if (!$target.is(':input')) {
            // div and contents, except inputs
            alert('click');
        } else {
            // div's content inputs
        }
    });
});