javascript 如何从以前选择的单选按钮检查属性中删除?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/30052447/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to remove radio button checked attribute from previously selected?
提问by Manan
I have some radio buttons and I am adding checked attribute to selected radio button but having one problem. I want to remove checked="checked" attribute from radio button which selected.
我有一些单选按钮,我正在将选中的属性添加到选定的单选按钮,但有一个问题。我想从选中的单选按钮中删除 checked="checked" 属性。
HTML Code:
HTML代码:
<div class="tabtwo-info">
<div class="tab-two">
<div class="col-lg-4 col-md-4 col-sm-4 "> <a class="brokersector" href="javascript:void(0);">
<input type="radio" value="" id="" name="brokersector">
<div class="image-cat-box">
<div class="image-box">
</div>
<div class="title-cat">
Unsecured Loans
</div>
</div>
</a>
</div>
<div class="col-lg-4 col-md-4 col-sm-4 "> <a class="brokersector" href="javascript:void(0);">
<input type="radio" value="" id="" name="brokersector">
<div class="image-cat-box">
<div class="image-box">
</div>
<div class="title-cat">
Secured 2nd Charge Lending
</div>
</div>
</a>
</div>
<div class="col-lg-4 col-md-4 col-sm-4 "> <a class="brokersector" href="javascript:void(0);">
<input type="radio" value="" id="" name="brokersector">
<div class="image-cat-box">
<div class="image-box">
</div>
<div class="title-cat">
Overdrafts
</div>
</div>
</a>
</div>
<div class="seperator">
<div class="container">
<div class="row"> <span class="sep"></span>
</div>
</div>
</div>
<div class="col-lg-4 col-md-4 col-sm-4 "> <a class="brokersector" href="javascript:void(0);">
<input type="radio" value="" id="" name="brokersector">
<div class="image-cat-box">
<div class="image-box">
</div>
<div class="title-cat">
Trade Finance
</div>
</div>
</a>
</div>
<div class="col-lg-4 col-md-4 col-sm-4 "> <a class="brokersector" href="javascript:void(0);">
<input type="radio" value="" id="" name="brokersector">
<div class="image-cat-box">
<div class="image-box">
</div>
<div class="title-cat">
Business Cash Advance
</div>
</div>
</a>
</div>
<div class="col-lg-4 col-md-4 col-sm-4 "> <a class="brokersector" href="javascript:void(0);">
<input type="radio" value="" id="" name="brokersector">
<div class="image-cat-box">
<div class="image-box">
</div>
<div class="title-cat">
Working Capital
</div>
</div>
</a>
</div>
<div class="seperator">
<div class="container">
<div class="row"> <span class="sep"></span>
</div>
</div>
</div>
<div class="col-lg-4 col-md-4 col-sm-4 "> <a class="brokersector" href="javascript:void(0);">
<input type="radio" value="" id="" name="brokersector">
<div class="image-cat-box">
<div class="image-box">
</div>
<div class="title-cat">
Stock Finance
</div>
</div>
</a>
</div>
<div class="col-lg-4 col-md-4 col-sm-4 "> <a class="brokersector" href="javascript:void(0);">
<input type="radio" value="" id="" name="brokersector">
<div class="image-cat-box">
<div class="image-box">
</div>
<div class="title-cat">
Acquisition Finance
</div>
</div>
</a>
</div>
<div class="seperator">
<div class="container">
<div class="row"> <span class="sep"></span>
</div>
</div>
</div>
</div>
</div>
jQuery Code:
jQuery 代码:
$(".tabtwo-info .brokersector").click(function () {
$(this).find('input:radio').attr('checked', true);
});
My JSFiddle: https://jsfiddle.net/jj57q8fs/
我的 JSFiddle:https://jsfiddle.net/jj57q8fs/
JSFiddle Screenshot:
JSFiddle 截图:
回答by Mackan
To force a remove of the attribute, before checking a new:
在检查新属性之前强制删除属性:
$(".brokersector").click(function () {
$('input[type=radio]').removeAttr('checked');
$(this).find('input[type=radio]').attr('checked', 'checked');
});
This will force an removal of all checked
on any radio button, before a new radio is set. The selector can be more specific of course, like in Idir's example.
这将强制删除所有checked
单选按钮,然后再设置新的单选按钮。选择器当然可以更具体,就像在 Idir 的例子中一样。
Also, @Regent posted a fiddleusing prop
instead. I would suggest you use this, as it states in the documentation:
此外,@Regent使用代替发布了一个小提琴prop
。我建议您使用它,正如文档中所述:
Nevertheless, the most important concept to remember about the checked attribute is that it does not correspond to the checked property. The attribute actually corresponds to the defaultChecked property and should be used only to set the initial value of the checkbox. The checked attribute value does not change with the state of the checkbox, while the checked property does.
然而,关于checked 属性要记住的最重要的概念是它不对应于checked 属性。该属性实际上对应于 defaultChecked 属性,应该仅用于设置复选框的初始值。选中的属性值不会随着复选框的状态而改变,而选中的属性会。
回答by syms
try this,
试试这个,
$(".tabtwo-info .brokersector").click(function() {
$('input[name=brokersector]').removeAttr('checked');
$(this).find('input:radio').attr('checked', 'checked');
});
回答by IDIR FETT
I agree with [Rory McCrossan][1], you don't need jQuery for that. but here is what you can do this:
我同意 [Rory McCrossan][1],你不需要 jQuery。但您可以这样做:
$('input[name=brokersector]:checked').removeAttr('checked');
回答by Sudhakar Singajogi
$(".tabtwo-info .brokersector").click(function () {
$("input:radio").removeAttr("checked");
$(this).find('input:radio').attr('checked', true);
});
});