在 JavaScript 中访问单选按钮值
在 JavaScript 中使用单选按钮输入时，检索所选选项的值至关重要。然而，在此类实现中遇到问题可能会令人沮丧。让我们研究一个常见问题及其解决方案。
问题
考虑以下代码片段：
function findSelection(field) {
var test = 'document.theForm.' + field;
var sizes = test;
for (i=0; i < sizes.length; i++) {
if (sizes[i].checked==true) {
return sizes[i].value;
}
}
}尽管其预期目的，此代码尝试访问选定的单选按钮时始终返回“未定义”
解决方案
要解决此问题，我们可以利用现代方法，使用 querySelector() 方法：
document.querySelector('input[name="genderS"]:checked').value;这一行代码通过利用 querySelector() 中的 :checked 选择器来检索所选单选按钮的值
优点
此解决方案具有多项优势：
实现
HTML:
<form action="#n" name="theForm">
<label for="gender">Gender: </label>
<input type="radio" name="genderS" value="1" checked> Male
<input type="radio" name="genderS" value="0" > Female<br><br>
<a href="javascript: submitForm()">Search</a>
</form>JavaScript:
function submitForm() {
var gender = document.querySelector('input[name="genderS"]:checked').value;
alert(gender);
}注意：您不需要在此实现中包含 jQuery 路径。
以上是如何在 JavaScript 中高效获取选定单选按钮的值？的详细内容。更多信息请关注PHP中文网其他相关文章！
