javascript - 在多个复选框中选中全部或取消选中全部

Question

我有多个复选框的代码

HTML:

<fieldset data-role="collapsible">
    <legend>Pick one</legend>
    <div data-role="controlgroup" id="ZIBI" align="right" >
    </div>
</fieldset>

jQuery/JavaScript:

myArray1 = new Array(
           "1","2","3","4","5","6"
           );

 $("#ZIBI").html('');
           for (var i = 0; i < myArray1.length; i++) {
               row = myArray1[i];
               $("#ZIBI").append(
                   '<label for=' + row + '>' + row + '</label>' +
                   '<input type="checkbox" name="favcolor" id=' + row + ' value=' + row + '>');
           }
           $('#ZIBI').trigger('create');

如何通过按任意按钮选中全部或取消选中全部？

谢谢

Answer 1

在此JsFiddle您将找到一种方法来选中/取消选中给定 div 中的所有复选框，使用 id 为 _main 的复选框:

function checkAll(e){
    e = e || event;
    var from = e.target || e.srcElement
       ,cbs = this.querySelectorAll('input'), i=1;
    if (/^_main$/i.test(from.id)){
        for (;i<cbs.length;i+=1){
            cbs[i].checked = from.checked; 
        }
    } else {
      var main = document.querySelector('#_main')
         ,j = cbs.length;    
      for (;i<cbs.length;i+=1){
          j -= cbs[i].checked ? 0 : 1;
      }
      main.checked = j === cbs.length ? true : false;
    }
}