Question

我有10个复选框正常工作，检查全部并取消选中所有...当你点击＆＃39;选择全部＆＃39;如果取消选中任何一个复选框，则选择全部＆＃39;保持在检查状态......

代码在这里......

 function selectAll(status) {
       $('input[name=selectedId]').each(function(){
         $(this).prop('checked', status);
      });

    }


   <input type="checkbox" class="selectedId" name="selectedId" id="1" />1 <br />
   <input type="checkbox" class="selectedId" name="selectedId" id="2" />2 <br />
   <input type="checkbox" class="selectedId" name="selectedId" id="3" />3 <br />
   <input type="checkbox" class="selectedId" name="selectedId" id="4" />4 <br />
   <input type="checkbox" class="selectedId" name="selectedId" id="5" />5 <br />
   <input type="checkbox" class="selectedId" name="selectedId" id="6" />6 <br />
   <input type="checkbox" class="selectedId" name="selectedId" id="6" />6 <br />
   <input type="checkbox" class="selectedId" name="selectedId" id="7" />7 <br />
   <input type="checkbox" class="selectedId" name="selectedId" id="8" />8 <br />
   <input type="checkbox" class="selectedId" name="selectedId" id="9" />9 <br />
   <input type="checkbox" class="selectedId" name="selectedId" id="10" />10<br/>

Answer 1

同时将length checkbox与length个checked复选框进行比较

function selectAll() {
  var checked = this.checked;
  $('input[name=selectedId]').each(function() {
    $(this).prop('checked', checked);
  });
}
$('#selectall').on('change', selectAll);
$('input[name=selectedId]').change(function() {
  $('#selectall').prop('checked', $('input[name=selectedId]:checked').length == $('input[name=selectedId]').length);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<input type="checkbox" class="selectedId" id="selectall" />Select all
<br />
<br />

<input type="checkbox" class="selectedId" name="selectedId" id="1" />1
<br />
<input type="checkbox" class="selectedId" name="selectedId" id="2" />2
<br />
<input type="checkbox" class="selectedId" name="selectedId" id="3" />3
<br />
<input type="checkbox" class="selectedId" name="selectedId" id="4" />4
<br />
<input type="checkbox" class="selectedId" name="selectedId" id="5" />5
<br />
<input type="checkbox" class="selectedId" name="selectedId" id="6" />6
<br />
<input type="checkbox" class="selectedId" name="selectedId" id="6" />6
<br />
<input type="checkbox" class="selectedId" name="selectedId" id="7" />7
<br />
<input type="checkbox" class="selectedId" name="selectedId" id="8" />8
<br />
<input type="checkbox" class="selectedId" name="selectedId" id="9" />9
<br />
<input type="checkbox" class="selectedId" name="selectedId" id="10" />10
<br/>

Answer 2

＆＃13;

function selectAll(status) {
       $('input[name="selectedId"]').each(function(){
         $(this).prop('checked', status);
      });

}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

   <button onclick="selectAll(true)">Select All</button>
   <button onclick="selectAll(false)">Unselect All</button>
<br>
   <input type="checkbox" class="selectedId" name="selectedId" id="1" />1 <br />
   <input type="checkbox" class="selectedId" name="selectedId" id="2" />2 <br />
   <input type="checkbox" class="selectedId" name="selectedId" id="3" />3 <br />
   <input type="checkbox" class="selectedId" name="selectedId" id="4" />4 <br />
   <input type="checkbox" class="selectedId" name="selectedId" id="5" />5 <br />
   <input type="checkbox" class="selectedId" name="selectedId" id="6" />6 <br />
   <input type="checkbox" class="selectedId" name="selectedId" id="6" />6 <br />
   <input type="checkbox" class="selectedId" name="selectedId" id="7" />7 <br />
   <input type="checkbox" class="selectedId" name="selectedId" id="8" />8 <br />
   <input type="checkbox" class="selectedId" name="selectedId" id="9" />9 <br />
   <input type="checkbox" class="selectedId" name="selectedId" id="10" />10<br/>

＆＃13;

选择全部并取消选中jquery复选框

2 个答案: