2016-09-27 176 views
0

我有10複選框正常工作與檢查所有,並取消所有選擇所有不工作時,如果取消選中任何複選框然後選擇全部保持檢查狀態...選擇所有和取消選擇複選框與jquery

代碼是在這裏....

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/> 
+0

請編輯您的問題,以便爲包括[最小,完整,可驗證的示例](http://stackoverflow.com/help/mcve)。 – MJH

+0

[使用jQuery爲複選框設置「已選中」可能的重複](http://stackoverflow.com/questions/426258/setting-checked-for-a-checkbox-with-jquery) –

回答

1

還與checkedlength複選框

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/>
比較 checkbox

0

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

 
}
<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/>