逐行选中和取消选中复选框

debugcn 发表于 Dev

ish

大家好，我有多行是通过foreach循环从我的数据库中获取的。

我每行有2个复选框，我要尝试的是...如果我选中第一个复选框，则意味着自动选中了第二个复选框。

为此，我使用ID来选择第二个复选框，现在由于每一行的ID相同，如果我选择第一行，则第一个复选框意味着它选中了所有第二个复选框。但是我需要得到的是选中的特定行的第二个复选框。任何人的帮助。抱歉，没有共享jsfiddle这样的实时演示。我希望你们能理解我的问题。

<thead>
<th><input type="checkbox" id="select_all"></th>
</thead>

<?php foreach ($category_details as $key => $category_detail): ?>
<tr>
<td>

  <input type="checkbox" class="checkbox" id="select_img" name="ids[]" value="<?php echo $category_detail['id'];?>"/>
  <input type="checkbox" class="checkbox checkimg" name="imgs[]" value="<?php echo  $category_detail['category_image'];?>"/>

</td>

<td>...</td> <!-- etc -->
</tr>
<?php endforeach ?>

    $(document).ready(function(){
    $('#select_all').on('click',function(){
        if(this.checked){
            $('.checkbox').each(function(){
                this.checked = true;
            });
        }else{
             $('.checkbox').each(function(){
                this.checked = false;
            });
        }
    });

    $('#select_img').on('click',function(){
        if(this.checked){
            $('.checkimg').each(function(){
                this.checked = true;
            });
        }else{
             $('.checkimg').each(function(){
                this.checked = false;
            });
        }
    });

    $('.checkbox').on('click',function(){
        if($('.checkbox:checked').length == $('.checkbox').length){
            $('#select_all').prop('checked',true);
        }else{
            $('#select_all').prop('checked',false);
        }
    });
});

大仙世界

您可以使用兄弟姐妹jquery函数。例如：

$('.whole_row').on('click',function(){

    if(this.checked){
    
        $(this).siblings().each(function(){
            this.checked = true;
        });
    }else{
         $(this).siblings().each(function(){
            this.checked = false;
        });
    }
});

这样，它将迭代同级标签，并且不会超出表行。只使用类而不是id

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。