Question

我正在制作一个简单的复选框树

如果您点击太平洋＆gt;加利福尼亚＆gt;湾区＆gt;然后一个复选框。如果您取消选中Bay Area，则取消选中子复选框。到现在为止还挺好。我遇到的问题是如果你再次这样做，但是这次取消选中加利福尼亚然后再检查一下Bat Area和孩子都没有检查，但是如果你检查湾区，则切换是相反的。

如何取消切换或防止这种情况发生。

$('.region-group-checkbox').click(function() {
    $(this).siblings('.region-state').toggle();
    $(this).siblings().next().find(':checkbox').prop('checked', false); 
});
$('.region-state-checkbox').click(function() {
    $(this).siblings('.region-state-area').toggle();
    $(this).siblings().next().find(':checkbox').prop('checked', false); 
});   
$('.region-state-area-checkbox').click(function() {
    $(this).siblings('.region-state-area-sub').toggle();
    $(this).siblings().next().find(':checkbox').prop('checked', false); 
});

Answer 1

您可以为这些复选框触发checked事件，而不是将属性false设置为click。

$('.region-group-checkbox').click(function () {
    $(this).siblings('.region-state').toggle();
    $(this)
        .siblings()
        .next()
        .find(':checkbox:checked')
        .trigger('click');
});
$('.region-state-checkbox').click(function () {
    $(this).siblings('.region-state-area').toggle();
    $(this)
        .siblings()
        .next()
        .find(':checkbox:checked')
        .trigger('click');
});
$('.region-state-area-checkbox').click(function () {
    $(this).siblings('.region-state-area-sub').toggle();
    $(this)
        .siblings()
        .next()
        .find(':checkbox:checked')
        .trigger('click'); 
});

http://jsfiddle.net/9dvR5/2/

这可能不是最优雅的解决方案，但您应该很容易理解。

取消选中父级时的jQuery帮助我需要切换子复选框

1 个答案: