如何选择全部/取消选中未禁用的所有复选框？

4 回答

• 0

  这是另一种方法 . 而不是使用 filter 我使用了 :enabled . 还使用 on jquery来检测新添加的复选框 . 希望它会对你有所帮助 .

  $(document).on('click','.checkBoxClass',function() {
          var selected = $('.checkBoxClass:enabled').length;
      if ($('.checkBoxClass:checked:enabled').length === selected) {
        $('#ckbCheckAll').prop('checked', true);
      } else {
        $('#ckbCheckAll').prop('checked', false);
      }
  })
  

  demo

  回复于 2024-04-28T18:53:54+08:00
• 0

  要检测禁用的复选框，您可以使用jquery filter 方法，如下所示：

  $(".checkBoxClass").filter(function(){
      return !$(this).attr('disabled');
  }).prop('checked', $(this).prop('checked'));
  

  通过像这样使用 filter ，JQuery更改了未禁用属性的复选框 .

  并使用 .prop('checked', false) 或 .attr('checked', false) 取消选中添加新复选框按钮的复选框 .

  所以要取消选中全部保存并添加复选框使用：

  $("#ckbCheckAll").attr('checked', false);
  

  并取消选中addcheckbox上所有已启用的复选框：

  $(".checkBoxClass").filter(function(){
      return !$(this).attr('disabled');
  }).prop('checked', false);
  

  您还应该使用 $(document).on("click",".checkBoxClass",function(){}) binder让JQuery绑定 click 事件以动态添加复选框 . 通过执行此操作并添加一些额外的jquery，选中所有复选框，选中所有复选框时选中 .

  Updated Fiddle

  回复于 2024-04-28T18:53:54+08:00
• 0

  试试这个，它只会启用checkobox并选择/取消选择它们 .

  $(document).ready(function() {
    $("#ckbCheckAll").click(function() {
      $(".checkBoxClass:enabled").prop('checked', $(this).checked);
    });
  });
  

  检查小提琴http://jsfiddle.net/p73wW/8/

  回复于 2024-04-28T18:53:54+08:00
• 2

  试试这个 ：

  $(document).ready(function() {
  $("#ckbCheckAll").click(function() {
        var checked = false;
        if($(this).prop('checked') == true) {
            checked = true;
        }
        $("#myTable tbody tr").each(function() {
            if($(this).find('.checkBoxClass').attr('disabled') != 'disabled') {
                $(this).find(".checkBoxClass").prop('checked', checked);
            }
        });
  });
  
  $('.checkBoxClass').click(function() {
      var i = 1;
      var totalCheckboxes = $("#myTable tbody tr").length;
      if($(this).prop('checked') == true) {
          $("#myTable tbody tr").each(function() {
              if($(this).find('.checkBoxClass').attr('disabled') != 'disabled') {
                  if($(this).find(".checkBoxClass").prop('checked') == true) {
                      i++;
                  }
              }
          });
      }
      if(i==totalCheckboxes) {
          $("#ckbCheckAll").prop('checked', true);
      } else {
          $("#ckbCheckAll").prop('checked', false);
      }
  });
  
  count = 5;
  $('#save').click(function() {
      $('.checkBoxClass').each(function() {
          if ($(this).is(':checked')) {
              $(this).prop('disabled', true);
          }
      });
      $("#ckbCheckAll").prop('checked', false);
  });
  
  $('#add').click(function() {
      count = count + 1;
      $('#myTable').append('<tr><td><input type="checkbox" class="checkBoxClass" /> <span>Option'+count+'</span></td></tr>')
  });
  });
  

  Updated Fiddle

  回复于 2024-04-28T18:53:54+08:00