在JavaScript中,判定单选框(Radio Button)的状态通常涉及以下几个步骤:
<input type="radio">
:HTML中用于创建单选框的标签。checked
属性:用于确定单选框是否被选中。checked
属性,可以使单选框默认被选中。checked
属性。假设HTML中有以下单选框:
<form id="myForm">
<input type="radio" name="gender" value="male" id="male"> Male<br>
<input type="radio" name="gender" value="female" id="female"> Female<br>
<input type="radio" name="gender" value="other" id="other"> Other
</form>
function checkRadioSelected(name) {
const radios = document.getElementsByName(name);
for (let i = 0; i < radios.length; i++) {
if (radios[i].checked) {
return radios[i].value;
}
}
return null;
}
// 使用示例
const selectedGender = checkRadioSelected('gender');
if (selectedGender) {
console.log('Selected gender:', selectedGender);
} else {
console.log('No gender selected');
}
function setRadioChecked(name, value) {
const radios = document.getElementsByName(name);
for (let i = 0; i < radios.length; i++) {
if (radios[i].value === value) {
radios[i].checked = true;
break;
}
}
}
// 使用示例
setRadioChecked('gender', 'female');
name
属性。checked
属性。window.onload
事件中,或者使用DOMContentLoaded
事件。console.log
输出调试信息,确保代码执行路径正确。通过以上方法,你可以有效地判定和操作单选框的状态。
领取专属 10元无门槛券
手把手带您无忧上云