如何使用JavaScript设置单选按钮状态

时间:2012-02-28 04:55:29

标签: javascript html5

最好使用哪种方法通过JavaScript选择性地将单个或多个单选按钮设置为所需的设置?

8 个答案:

答案 0 :(得分:85)

非常简单

radiobtn = document.getElementById("theid");
radiobtn.checked = true;

答案 1 :(得分:27)

表格

<form name="teenageMutant">
  <input value="aa" type="radio" name="ninjaTurtles"/>
  <input value="bb" type="radio" name="ninjaTurtles"/>
  <input value="cc" type="radio" name="ninjaTurtles" checked/>
</form>
默认情况下会检查

value =“cc”,如果删除“已选中”,则会在首次加载表单时检查非框。

document.teenageMutant.ninjaTurtles[0].checked=true;

现在值=“aa”被选中。其他无线电复选框未选中。

在行动中看到它:http://jsfiddle.net/yaArr/

您可以使用表单ID和单选按钮ID执行相同操作。这是一个带有id的表单。

<form id="lizardPeople" name="teenageMutant">
  <input id="dinosaurs" value="aa" type="radio" name="ninjaTurtles"/>
  <input id="elephant" value="bb" type="radio" name="ninjaTurtles"/>
  <input id="dodoBird" value="cc" type="radio" name="ninjaTurtles" checked/>
</form>

value =“cc”默认选中。

document.forms["lizardPeople"]["dinosaurs"].checked=true;

现在将值=“aa”与id =“dinosaurs”进行检查,就像之前一样。

查看实际操作:http://jsfiddle.net/jPfXS/

答案 2 :(得分:16)

Vanilla Javascript:

yourRadioButton.checked = true;

jQuery的:

$('input[name=foo]').prop('checked', true);

$("input:checkbox").val() == "true"

答案 3 :(得分:10)

您还可以明确设置单选按钮的值:

<form name="gendersForm">
  <input type="radio" name="gender" value="M" /> Man
  <input type="radio" name="gender" value="F" /> Woman
</form>

使用以下脚本:

document.gendersForm.gender.value="F";

将自动检查相应的单选按钮。

查看example on JSFiddle

答案 4 :(得分:1)

尝试

myRadio.checked=true
<input type="radio" id="myRadio">My radio<br>

答案 5 :(得分:0)

我正在配置文档片段中的单选按钮,并尝试使用radiobtn.checked = true;

这没有用,所以我采用了这个解决方案:

radiobtn.setAttribute("checked", "checked");

答案 6 :(得分:0)

/**
 * setCheckedValueOfRadioButtonGroup
 * @param {html input type=radio} vRadioObj 
 * @param {the radiobutton with this value will be checked} vValue 
 */
function setCheckedValueOfRadioButtonGroup(vRadioObj, vValue) {
    var radios = document.getElementsByName(vRadioObj.name);
    for (var j = 0; j < radios.length; j++) {
        if (radios[j].value == vValue) {
            radios[j].checked = true;
            break;
        }
    }
}

答案 7 :(得分:-1)

$(“#id_of_radiobutton”)。prop(“ checked”,true);