javascript - jQuery中的复选框依赖项

我正在尝试实现各个复选框之间的依赖关系，但是，我有一个简单的方案，即如果and复选框未选中，则其他复选框也应按升序取消选中。
让第一个复选框具有id=1，我共有5个复选框，如果未选中第一个复选框，则也应取消选中ID大于当前复选框的其他复选框，即，也应取消选中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);
});

最佳答案

如果我正确理解了您的问题，那么您正在寻找这样的东西：

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来使其更有效，但这可能会满足您的需求。

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