javascript 在javascript中设置单选按钮值
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/16060751/
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
Set radio button value in javascript
提问by ds345
I am trying to set the value of the radio button via javascript. But I am not being able to do so. What I tried to do was have 4 radio buttons one of which is already selected. If I select some other radio button and click on Refresh, default radio button should be selected.
我正在尝试通过 javascript 设置单选按钮的值。但我不能这样做。我试图做的是有 4 个单选按钮，其中一个已经被选中。如果我选择其他一些单选按钮并单击刷新，则应选择默认单选按钮。
http://jsfiddle.net/ds345/Un8XK/1/
http://jsfiddle.net/ds345/Un8XK/1/
HTML:
HTML：
<fieldset data-role="controlgroup" data-type="vertical">
<input type="radio" name="radio" id="x" data-theme="a" />
<label for="x" style="color: White">X</label>
<input type="radio" name="radio" id="y" onclick="axisonoff(this)" data-theme="a" />
<label for="y" style="color: White">Y</label>
<input type="radio" name="radio" id="z" data-theme="a" />
<label for="z" >Z</label>
<input type="radio" name="radio" id="none" data-theme="a" />
<label for="none" style="color: White">None</label>
</fieldset>
<button id = "Refresh" value="Refresh">Refresh</button>
JS:
JS：
$(document).ready(function () {
$("#none").attr("checked", true).checkboxradio("refresh"); // if this line is not present initially then it works for the 1st refresh.
});
$("#Refresh").click(function(){
$("#x").attr("checked", false).checkboxradio("refresh");
$("#y").attr("checked", false).checkboxradio("refresh");
$("#z").attr("checked", false).checkboxradio("refresh");
$("#none").attr("checked", true).checkboxradio("refresh");
});
I am sure that I have missed something very small but not able to figure out why this approach is not working.
我确信我错过了一些非常小的东西，但无法弄清楚为什么这种方法不起作用。
Tools used: Javascript,Jquery 1.9 and JQuery mobile 1.3
使用的工具：Javascript、Jquery 1.9 和 JQuery mobile 1.3
Thanks,
谢谢，
Deeksha
迪克沙
回答by James Donnelly
You should use propover attrwhen dealing with boolean attributes.
处理布尔属性时应该使用propover attr。
.attr("checked", false)will add checked="false"to your element.
In HTML, <input checked="false" .../>is the same as <input checked="true" .../>or simply <input checked .../>as the attribute simply needs to be present on the element for it to be active.
See this JSFiddle example.
.attr("checked", false)将添加checked="false"到您的元素。
在 HTML 中，<input checked="false" .../>与<input checked="true" .../>或仅仅<input checked .../>因为属性只需要出现在元素上才能使其处于活动状态。
请参阅此JSFiddle 示例。
Change your code to use .prop()instead:
更改您的代码以使用.prop()：
$("#none").prop("checked", false)...
Here is a fixed version of your JSFiddle demo: http://jsfiddle.net/Un8XK/8/
这是您的 JSFiddle 演示的固定版本：http: //jsfiddle.net/Un8XK/8/
回答by RobG
What you have missed is that there is no need for script. Simply use a form with a reset button:
您错过的是不需要脚本。只需使用带有重置按钮的表单：
<form>
<input type="radio" name="radio" value="0" checked>0<br>
<input type="radio" name="radio" value="1">1<br>
<input type="radio" name="radio" value="2">2<br>
<input type="radio" name="radio" value="3">3<br>
<input type="reset">
</form>
If you really mustuse script, you can simply return the radio buttons to their default by adding a button to the form:
如果你真的必须使用脚本，你可以通过向表单添加一个按钮来简单地将单选按钮恢复为默认值：
<input type="button" onclick="reset(this.form.radio);" value="Script reset">
and a function:
和一个功能：
<script>
function reset(els) {
for (var i=0, iLen=els.length; i<iLen; i++) {
els[i].checked = els[i].defaultChecked;
}
}
</script>
