javascript - 在父单击时使用 jQuery 切换复选框

Question

我有以下代码示例:http://jsfiddle.net/sX3w9/

$('.item').on('click', function() {
            var checkbox = $(this).find('input');
            checkbox.attr("checked", !checkbox.attr("checked"));    
            $(this).toggleClass('selected');
        });

用户应该能够点击 div.item 和/或其中的复选框，它应该选中或取消选中该复选框，并从 div 中添加或删除所选类。

它在单击 div 时有效，但单击复选框会立即再次取消选中它...

Answer 1

试试下面的代码:

$('.item').on('click', function() {
            var checkbox = $(this).find('input');
            checkbox.attr("checked", !checkbox.attr("checked"));    
            $(this).toggleClass('selected');
        });
$(".item input").on("click", function(e){
    e.stopPropagation();
    $(this).parents(".item").toggleClass('selected');
});

问题是，当您选中复选框时，单击 div 会再次取消选中复选框。