我有一个 check all 复选框,一旦它被选中,它会检查所有复选框,反之亦然。
如果取消选中任何复选框,如何取消选中所有复选框,如果选中所有复选框,如何选中选中所有复选框。
<form action="#">
<p><label><input type="checkbox" id="checkAll"/> Check all</label></p>
<fieldset>
<legend>Loads of checkboxes</legend>
<p><label><input type="checkbox" /> Option 1</label></p>
<p><label><input type="checkbox" /> Option 2</label></p>
<p><label><input type="checkbox" /> Option 3</label></p>
<p><label><input type="checkbox" /> Option 4</label></p>
</fieldset>
</form>
$("#checkAll").change(function () {
$("input:checkbox").prop('checked', $(this).prop("checked"));
});
最佳答案
如果您将点击处理程序添加到下方的复选框,您可以将复选框总数与选中的复选框数进行比较。试试这个:
$("#checkAll").change(function () {
$("input:checkbox").prop('checked', $(this).prop("checked"));
});
$('.checkbox').change(function() {
$('#checkAll').prop('checked', $('.checkbox').length == $('.checkbox:checked').length);
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form action="#">
<p><label><input type="checkbox" id="checkAll"/> Check all</label></p>
<fieldset>
<legend>Loads of checkboxes</legend>
<p><label><input type="checkbox" class="checkbox" /> Option 1</label></p>
<p><label><input type="checkbox" class="checkbox" /> Option 2</label></p>
<p><label><input type="checkbox" class="checkbox" /> Option 3</label></p>
<p><label><input type="checkbox" class="checkbox" /> Option 4</label></p>
</fieldset>
</form>
关于javascript - 如果取消选中任何复选框,如何取消选中所有复选框?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35576662/