如何切換復選框選擇而不是僅選擇？

Question

我目前正在將此 JavaScript 代碼片段一次用於 select 3 個復選框

$(document).ready(function() {
   var $cbs = $('input:checkbox[name="select[]"]'),
       $links = $('a[name="check"]');

   $links.click(function() {
      var start = $links.index(this) * 3,
          end = start + 3;
      $cbs.slice(start,end).prop("checked",true);
   });
});

目前這段代碼只選擇復選框，但是我想知道是否有人知道如何修改它以便它打開和關閉復選框選擇？

這是我當前代碼的示例：“ jsfiddle ”- 單擊 1-3、4-6 鏈接等以選中復選框。

Answer 1

使prop("checked", ...)調用的第二個參數取決於切片中第一個（或其他）復選框的“checked”狀態：

// ...
$cbs.slice(start,end).prop("checked", !$cbs.slice(start).prop("checked"));

這是一個更新的 jsFiddle 。

[編輯]或者單獨更新切片中的每個復選框：

// ...
$cbs.slice(start,end).each(function() {
  var $this = $(this);
  $this.prop("checked", !$this.prop("checked"));
});

http://jsfiddle.net/ShZNF/3/

Answer 2

   $cbs.slice(start,end).each(function() {
       if ($(this).is(":checked")) {
           $(this).removeProp("checked");   
       } else {
           $(this).prop("checked",true);
       }
   });

http://jsfiddle.net/ShZNF/1/

編輯：Maeric 的解決方案更好。 我不知道 removeProp 有這個陷阱：

注意：不要使用此方法刪除本機屬性，例如已選中、已禁用或已選中。 這將完全刪除該屬性，並且一旦刪除，就無法再次添加到元素中。 使用.prop() 將這些屬性設置為 false。