<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>单选框弹出提示示例</title>
</head>
<body>
<h1>请选择您喜欢的颜色：</h1>
<input type="radio" name="color" value="red">红色<br>
<input type="radio" name="color" value="green">绿色<br>
<input type="radio" name="color" value="blue">蓝色<br>
<buttonshowSelected()">点击选择</button>
<script>
function showSelected() {
var radios = document.getElementsByName("color"); // 获取单选框列表
var selectedColor = null;
for (var i = 0; i < radios.length; i++) { // 遍历单选框
if (radios[i].checked) { // 如果当前单选框被选中
selectedColor = radios[i].value; // 将值赋给已选变量
break; // 跳出循环
}
}
if (selectedColor !== null) { // 判断是否有选择
alert("您选择了：" + selectedColor);
} else {
alert("您没有选择任何颜色。");
}
}
</script>
</body>
</html>
该代码创建了一个包含若干个单选按钮的表单，并在页面底部添加了一个“点击选择”按钮。当用户点击该按钮时，会根据当前选中的单选按钮弹出提示框，告知用户其选择的颜色。如果用户没有选择任何一个单选按钮，则同样会有提示框提醒用户。
