Kev*_*lly 15 javascript checkbox jquery selection
我有一个复选框选择所有问题.我有多个复选框,可以由主控制器触发.
如果主要的是检查,那么你可以选择任何复选框(这是有效的).现在我的问题是,当我检查"无"时,他们所有人甚至都不见了
我需要的是不要取消选中主人.我可以拥有尽可能多的复选框.
有没有一个解决方案来做到这一点,而不是在每个上面都有ID或自动取消选中所有复选框而不是主复选框?
这是我的代码:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#checkAll').click(function() {
if(!$('#master').is(':checked')) { return;
} $('input[type="checkbox"]').attr('checked', true);
});
$('#checkNone').click(function() {
$('input[type="checkbox"]').attr('checked', false); });
$('#master').click(function() { if($('#master').is(':checked')) {
return; } $('input[type="checkbox"]').attr('checked', false);
});
$('input[type="checkbox"]').click(function() {
if(!$('#master').is(':checked')) { $(this).attr('checked', false);
}
});
});
</script>
</head>
<input type="checkbox" value="master" id="master">master
<span id="checkAll">All</span>
<span id="checkNone">None</span>
<input type="checkbox" value="1" id="c1">1
<input type="checkbox" value="2" id="c2">2
<input type="checkbox" value="3" id="c3">3
<input type="checkbox" value="4" id="c4">4
<input type="checkbox" value="5" id="c5">5
Run Code Online (Sandbox Code Playgroud)
Boo*_*eus 12
根据你的代码,我会在你想要选择all/none的复选框周围添加一个包装器,然后给出包装器id和输入以选择all或none.
$('#list input[type="checkbox"]').attr('checked', false);
或者用于jQuery 1.6+
$('#list input[type="checkbox"]').prop('checked', false);
这样,您可以控制所有复选框,而不会影响"主"复选框.
这是代码:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#checkAll').click(function() {
if(!$('#master').is(':checked')) {
return;
}
$('#list input[type="checkbox"]').attr('checked', true);
});
$('#checkNone').click(function() {
$('#list input[type="checkbox"]').attr('checked', false);
});
$('#master').click(function() {
if($('#master').is(':checked')) {
return;
}
$('#list input[type="checkbox"]').attr('checked', false);
});
$('#list input[type="checkbox"]').click(function() {
if(!$('#master').is(':checked')) {
$(this).attr('checked', false);
}
});
});
</script>
</head>
<input type="checkbox" value="master" id="master">master
<span id="checkAll">All</span>
<span id="checkNone">None</span>
<div id="list">
<input type="checkbox" value="1">1
<input type="checkbox" value="2">2
<input type="checkbox" value="3">3
<input type="checkbox" value="4">4
<input type="checkbox" value="5">5
</div>
Run Code Online (Sandbox Code Playgroud)
您只需要一个非常小的修改就可以排除主人.
您可以使用.not("#master")这样做:
$('#checkNone').click(function() {
$('input[type="checkbox"]').not("#master").attr('checked', false); });
Run Code Online (Sandbox Code Playgroud)