同一个html页面中,包含两个单选框和五个文本框,如何实现在一个页面,点击不同的选择,留下对应的文本
时间: 2023-06-11 12:05:30 浏览: 46
框?
您可以使用 JavaScript 来实现此功能。您需要为每个单选框和文本框添加 ID,以便在 JavaScript 代码中引用它们。然后,您可以在单选框上添加单击事件,当单击每个单选框时,您可以使用条件语句来隐藏或显示所选文本框。
下面是一个示例代码:
```html
<input type="radio" name="choice" id="choice1" onclick="showText('text1')">Choice 1<br>
<input type="radio" name="choice" id="choice2" onclick="showText('text2')">Choice 2<br>
<input type="text" id="text1" style="display:none;"><br>
<input type="text" id="text2" style="display:none;"><br>
<script>
function showText(textId) {
var text = document.getElementById(textId);
var choices = document.getElementsByName("choice");
for (var i = 0; i < choices.length; i++) {
if (choices[i].checked) {
text.style.display = "block";
} else {
text.style.display = "none";
}
}
}
</script>
```
此代码将在单击每个单选框时调用 `showText` 函数。如果单选框被选中,则显示所选文本框,否则隐藏它。