[英]Uncheck all other checkboxes
I need to clear all other checkboxes when a user clicks a checkbox. 当用户单击复选框时,我需要清除所有其他复选框。 Pretty much the same behavior as a radio button. 与单选按钮几乎相同的行为。 User clicks checkbox 'A' and checkboxes 'B' and 'C' are both unchecked. 用户单击复选框“A”,复选框“B”和“C”均未选中。 I am using jquery but I can't figure out how to accomplish this. 我正在使用jquery但我无法弄清楚如何实现这一目标。 Any ideas? 有任何想法吗?
Here are how the checkboxes are set u: 以下是如何设置复选框:
<div class="sales_block_one">
<span class="sales_box_option_set"><input type="checkbox" value="1" id="exopt10i11553501716" name="optset[0][id]" /><label for="exopt10i11553501716">Test + £100.00</label></span>
<span class="sales_box_option_set"><input type="checkbox" value="2" id="exopt11i21553501716" name="optset[1][id]" /><label for="exopt11i21553501716">Test + £ 200.00</label></span>
<span class="sales_box_option_set"><input type="checkbox" value="3" id="exopt12i31553501716" name="optset[2][id]" /><label for="exopt12i31553501716">Test 3 + £400.00</label></span>
</div>
if all the checkboxes are siblings, it's just like this, 如果所有复选框都是兄弟姐妹,那就像这样,
$(':checkbox').change(function(){
if (this.checked) {
$(this).siblings(':checkbox').attr('checked',false);
}
});
Well, if you really want to copy the behavior of the radio button, simple as this, 好吧,如果你真的想要复制单选按钮的行为,这很简单,
$(':checkbox').change(function(){
this.checked = true;
$(this).siblings(':checkbox').attr('checked',false);
});
siblings is when the elements has one same parent/container. 兄弟姐妹是元素有一个相同的父/容器。
sample 样品
<div>
<input type="checkbox" /><label>A</label>
<input type="checkbox" /><label>B</label>
<input type="checkbox" /><label>C</label>
<input type="checkbox" /><label>D</label>
</div>
in that, <input>
s and <label>
s are siblings. 在那里, <input>
和<label>
是兄弟姐妹。
In your case, which it's not siblings, you can do it this way, 在你的情况下,它不是兄弟姐妹,你可以这样做,
$('.sales_block_one :checkbox').change(function() {
var $self = this; // save the current object - checkbox that was clicked.
$self.checked = true; // make the clicked checkbox checked no matter what.
$($self).closest('span') // find the closest parent span...
.siblings('span.sales_box_option_set') // get the siblings of the span
.find(':checkbox').attr('checked',false); // then find the checbox inside each span and then uncheck it.
});
$("#checkboxA").click(function() {
var checkedStatus = this.checked;
$("#checkboxB_And_C_Selector").each(function() {
this.checked = !checkedStatus;
});
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.