📅  最后修改于: 2023-12-03 15:22:49.672000             🧑  作者: Mango
单选按钮组由多个单选按钮组成,用户只能选择其中的一个选项。在JavaScript中,我们可以通过获取所选单选按钮的value属性来获取它的值。
下面是一个单选按钮组的HTML代码示例:
<div>
<input type="radio" id="option1" name="option" value="option1">
<label for="option1">Option 1</label>
</div>
<div>
<input type="radio" id="option2" name="option" value="option2">
<label for="option2">Option 2</label>
</div>
<div>
<input type="radio" id="option3" name="option" value="option3">
<label for="option3">Option 3</label>
</div>
这个单选按钮组包含了三个单选按钮,分别有不同的id、name和value属性。其中name属性相同,表示它们是同一组的单选按钮。
我们可以使用JavaScript来获取被选中的单选按钮的值。下面是一段示例代码:
const options = document.getElementsByName('option');
let selectedOption;
for (let i = 0; i < options.length; i++) {
if (options[i].checked) {
selectedOption = options[i].value;
break;
}
}
console.log(selectedOption);
这段代码会获取所有name属性为'option'的单选按钮,然后遍历这些单选按钮,找到被选中的那个。一旦找到被选中的单选按钮,它的value属性就会被赋值给selectedOption变量。最后,我们可以使用console.log()方法将选项的值打印到控制台中。
以上就是单选按钮组获取值的简单介绍,希望对您有所帮助!