单选框选中,js控制文本框非必填
时间: 2023-08-16 15:09:05 浏览: 58
可以使用JavaScript来实现选中单选框时,将文本框设为非必填。可以添加一个事件监听器来监控单选框的选中状态,然后根据选中状态来更改文本框的required属性。
以下是一个示例代码:
HTML代码:
```
<label>
<input type="radio" name="required" value="yes"> 必填
</label>
<label>
<input type="radio" name="required" value="no"> 非必填
</label>
<input type="text" id="myInput" required>
```
JavaScript代码:
```
const radioButtons = document.getElementsByName("required");
const myInput = document.getElementById("myInput");
// 添加事件监听器
for (let i = 0; i < radioButtons.length; i++) {
radioButtons[i].addEventListener("change", function() {
if (this.value === "no") {
myInput.removeAttribute("required");
} else {
myInput.setAttribute("required", "");
}
});
}
```
这段代码首先获取了所有name属性为"required"的单选框,并获取了id为"myInput"的文本框。然后循环遍历所有单选框,添加了一个change事件监听器。当单选框的选中状态发生变化时,如果选中的是"非必填",则移除文本框的required属性,否则添加required属性。