我不是jQuery专家,但我已经尝试为我的应用程序创建了一个小脚本。我想选中所有的复选框,但它不能正常工作。
首先,我尝试使用attr
,之后我又尝试使用prop
,但我做错了一些事情。
我先试了一下:
$("#checkAll").change(function(){
if (! $('input:checkbox').is('checked')) {
$('input:checkbox').attr('checked','checked');
} else {
$('input:checkbox').removeAttr('checked');
}
});
但这并不管用。
接下来:这比上面的代码工作得更好
$("#checkAll").change(function(){
if (! $('input:checkbox').is('checked')) {
$('input:checkbox').prop('checked',true);
} else {
$('input:checkbox').prop('checked', false);
}
});
这两个例子都不起作用。
JSFiddle:http://jsfiddle.net/hhZfu/4/
发布于 2013-08-31 00:32:30
发布于 2014-09-06 13:30:43
这里有一个完整的解决方案。
$(document).ready(function() {
$("#checkedAll").change(function() {
if (this.checked) {
$(".checkSingle").each(function() {
this.checked=true;
});
} else {
$(".checkSingle").each(function() {
this.checked=false;
});
}
});
$(".checkSingle").click(function () {
if ($(this).is(":checked")) {
var isAllChecked = 0;
$(".checkSingle").each(function() {
if (!this.checked)
isAllChecked = 1;
});
if (isAllChecked == 0) {
$("#checkedAll").prop("checked", true);
}
}
else {
$("#checkedAll").prop("checked", false);
}
});
});
Html应该是:
选中三个复选框上的单个复选框将被选中和取消选中。
<input type="checkbox" name="checkedAll" id="checkedAll" />
<input type="checkbox" name="checkAll" class="checkSingle" />
<input type="checkbox" name="checkAll" class="checkSingle" />
<input type="checkbox" name="checkAll" class="checkSingle" />
希望这对某人有帮助,就像对我一样。
发布于 2018-05-01 16:02:17
我认为当用户手动选择全部复选框时,应自动选中全部复选框,或者用户取消选中所有选定复选框中的一个复选框时,应自动取消选中全部复选框。这是我的代码..
$('#checkall').change(function () {
$('.cb-element').prop('checked',this.checked);
});
$('.cb-element').change(function () {
if ($('.cb-element:checked').length == $('.cb-element').length){
$('#checkall').prop('checked',true);
}
else {
$('#checkall').prop('checked',false);
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<input type="checkbox" name="all" id="checkall" />Check All</br>
<input type="checkbox" class="cb-element" /> Checkbox 1</br>
<input type="checkbox" class="cb-element" /> Checkbox 2</br>
<input type="checkbox" class="cb-element" /> Checkbox 3
https://stackoverflow.com/questions/18537609
复制相似问题