Question

我有一个带复选框的表格，我想要执行“全部检查”和“取消全部检查”复选框，但我找不到检查所有复选框的方法。

这是我的代码：

<form>
    <?php foreach ($this->entries as $entry): ?>
        <tr class="table_head_seperator">
            <td class="grid_info" width="32px" bgcolor="#f6f6f6"><input type="checkbox" class="chk_boxes1" name="to_delete[<?PHP echo $entry['id'] ?>]"  /></td>
            <td class="grid_info" width="160px" bgcolor="#eeeeee"><span class="country_name"><?php echo $entry['user_name'] ?></span></td>
            <td class="grid_info" width="130px" bgcolor="#eeeeee"><span class="country_name"><?php echo $entry['date_created'] ?></span></td>
            <td class="grid_info" width="100px" bgcolor="#f6f6f6"><span class="country_name"><?php echo $entry['user_type_name'] ?></span></td>
        </tr>
    <?PHP endforeach; ?>

    <input type="checkbox" class="chk_boxes" label="check all"  />check all
    <input type="checkbox" class="unchk_boxes"   /> un-check all
</form>
<script type="text/javascript">
    $(document).ready(function() {
        $('.chk_boxes').click(function(){
            $('.chk_boxes1').attr('checked',checked)
        })
    });
</script>

Answer 1

$(function() {
    $('.chk_boxes').click(function() {
        $('.chk_boxes1').prop('checked', this.checked);
    });
});

这只会影响check all框。但是为什么要使用两个复选框呢？一个检查所有，一个取消选中所有，但不互斥。这必须是混淆用户的秘诀：）

Answer 2

尝试使用true|false。像这样：

$('.chk_boxes1').attr('checked',true);

补充评论：

此外，您的un-和check all复选框似乎是多余的。

<input type="checkbox" class="chk_boxes" label="check all"  />check all
<input type="checkbox" class="unchk_boxes"   /> un-check all

您可以只使用一个复选框来执行这两项操作，而不是这样做。因此，您的jQuery将如下所示：

$(document).ready(function() {
    $('.chk_boxes').click(function(){
            $('.chk_boxes1').attr('checked',$(this).attr('checked'));
    })
});

使用HTML：

<input type="checkbox" class="chk_boxes" label="check all"  />check all

Answer 3

请在此处查看工作解决方案http://jsfiddle.net/HBGzy/

您无需使用“取消选中所有”复选框：）

$('.chk_boxes').click(function(){
    var chk = $(this).attr('checked')?true:false;
    $('.chk_boxes1').attr('checked',chk);
});

Answer 4

你忘了引号：

$('.chk_boxes1').attr('checked','checked')

小提琴：http://jsfiddle.net/8ZHFn/

Answer 5

试试这个

 $(".chk_boxes").click(function()
   {
   var checked_status = this.checked;
   $(".chk_boxes1").each(function()
     {
      this.checked = checked_status;
     });
  });

因此，如果在检查或取消选中类chk_boxes的复选框时要影响的所有复选框的类名称为chk_boxes1，则会获取所有元素并相应地设置checked属性。

Answer 6

我认为你应该对复选框属性使用true或false。

Answer 7

<script type="text/javascript" charset="utf-8">
$('document').ready( function() {
    $('.chk_boxes').click( function() {
        $(':checkbox').attr('checked',true);
    });
});
</script>

Answer 8

关于全部检查/取消选中所有内容的建议.. 在选择全部检查后，我认为如果用户单击任何checkbox1，则应取消选中全部复选复选框，同时不选中全部复选框，如果用户逐个选中所有复选框，则应选中复选框。所以我建议你在使用check all / uncheck all时试试这个..

$(document).ready(function() {
    $('.chk_boxes').click(function(){
        $('.chk_boxes1').attr('checked',$(this).attr('checked'));
    })
    $('.chk_boxes1').click(function(){
        if($('.chk_boxes1').length == $('.chk_boxes1:checked').length)
              $('.chk_boxes').attr('checked',checked)
        else
             $('.chk_boxes').attr('checked',false)
    })
});

Answer 9

取消选中所有复选框/取消选中所有复选框遵循以下代码，使用以下代码非常简单

在您的html表单内添加以下代码行

<input type="checkbox" id='checkall' /> Select All

然后添加以下脚本

     <script type='text/javascript'>
 $(document).ready(function(){
   // Check or Uncheck All checkboxes
   $("#checkall").change(function(){
     var checked = $(this).is(':checked');
     if(checked){
       $(".checkbox").each(function(){
         $(this).prop("checked",true);
       });
     }else{
       $(".checkbox").each(function(){
         $(this).prop("checked",false);
       });
     }
   });
 
  // Changing state of CheckAll checkbox 
  $(".checkbox").click(function(){
 
    if($(".checkbox").length == $(".checkbox:checked").length) {
      $("#checkall").prop("checked", true);
    } else {
      $("#checkall").removeAttr("checked");
    }

  });
});
</script>

请记住，脚本代码中的.checkbox是html表单中其他复选框的类名

例如，如果您具有如下所示的输入复选框

<input class="checkbox" name="emailid[]" type="checkbox" value="<?php echo $email;?>" />

选中所有复选框

9 个答案: