在选择后禁用所有单选按钮可以通过以下步骤实现:
以下是一个示例代码,演示如何在选择后禁用所有单选按钮:
<!DOCTYPE html>
<html>
<head>
<title>禁用单选按钮示例</title>
</head>
<body>
<input type="radio" name="option" value="option1">选项1<br>
<input type="radio" name="option" value="option2">选项2<br>
<input type="radio" name="option" value="option3">选项3<br>
<input type="radio" name="option" value="option4">选项4<br>
<script>
// 获取所有单选按钮元素
var radioButtons = document.querySelectorAll('input[type="radio"]');
// 给每个单选按钮添加change事件监听器
radioButtons.forEach(function(button) {
button.addEventListener('change', function() {
// 遍历所有单选按钮,禁用除当前选中按钮外的其他按钮
radioButtons.forEach(function(btn) {
if (btn !== button) {
btn.disabled = true;
}
});
});
});
</script>
</body>
</html>
在上述示例中,我们使用querySelectorAll方法获取所有的单选按钮元素,并为每个单选按钮添加了change事件监听器。当某个单选按钮被选中时,change事件被触发,然后遍历所有单选按钮,禁用除当前选中按钮外的其他按钮。
这是一个简单的示例,实际应用中可能需要根据具体情况进行适当的修改和扩展。
领取专属 10元无门槛券
手把手带您无忧上云