jquery 中的复选框依赖项

Question

我正在尝试实现各种复选框之间的依赖关系，但是，我有一个简单的场景，如果和复选框未选中，则其他复选框也应按升序取消选中。让第一个checkbox有id=1，我总共有5个checkbox，如果第一个checkbox没有被选中，其他id大于当前的checkbox也应该没有被选中，即id=2, id=3, id=4, id=5也应该是未选中等等。

我的代码：

<input type="checkbox" id="1" class="cb">
<input type="checkbox" id="2" class="cb">
<input type="checkbox" id="3" class="cb">
<input type="checkbox" id="4" class="cb">
<input type="checkbox" id="5" class="cb">

$('input.CB').on('change', function() {
    $('input.CB').not(this).prop('checked', false);  
});

Answer 1

如果我正确理解你的问题，你正在寻找这样的东西：

lowest_unchecked = false;
$('.cb').on('change', function(){
    $('.cb').each(function(){

        if( !$(this).prop( 'checked' ) ){
            lowest_unchecked = $(this).attr('id');
        }
        if( lowest_unchecked !== false && lowest_unchecked < $(this).attr('id') ){
            $(this).prop('checked', false);
        }
    });
});

如果不检查 id 是否小于发生更改的 id，可以提高效率，但这可能正好满足您的需求。

编辑：根据要求添加 fiddle：https://jsfiddle.net/93o1kkjn/1/

jquery 中的复选框依赖项

Checkbox dependencies in jquery

html

javascript

checkbox