radio按钮选中给对应的input设置那么
时间: 2024-03-06 07:50:05 浏览: 74
当用户选中radio按钮时,可以使用JavaScript来给对应的input设置值。可以通过以下步骤实现:
1. 首先,获取radio按钮组和input元素的引用。
2. 然后,使用addEventListener()方法监听radio按钮组的change事件。
3. 在事件处理程序中,使用if语句检查哪个radio按钮被选中。
4. 最后,使用JavaScript的value属性将对应input元素的值设置为所选的radio按钮的值。
以下是示例代码:
HTML代码:
```html
<label>
<input type="radio" name="gender" value="male">
Male
</label>
<label>
<input type="radio" name="gender" value="female">
Female
</label>
<input type="text" id="gender-input">
```
JavaScript代码:
```javascript
const radioGroup = document.getElementsByName('gender');
const genderInput = document.getElementById('gender-input');
radioGroup.forEach(radio => {
radio.addEventListener('change', () => {
if (radio.checked) {
genderInput.value = radio.value;
}
});
});
```
这样,当用户选择一个radio按钮时,对应的input元素的值就会被设置为所选的radio按钮的值。
阅读全文