javascript控制复选框只能选取一个.
时间: 2024-01-07 16:11:49 浏览: 33
可以通过以下的代码实现控制复选框只能选取一个:
HTML 代码:
```html
<label>
<input type="checkbox" name="option" value="1" class="option">选项1
</label>
<label>
<input type="checkbox" name="option" value="2" class="option">选项2
</label>
<label>
<input type="checkbox" name="option" value="3" class="option">选项3
</label>
```
JavaScript 代码:
```javascript
const options = document.querySelectorAll('.option');
options.forEach(option => {
option.addEventListener('change', () => {
if (option.checked) {
options.forEach(opt => {
if (opt !== option) {
opt.checked = false;
}
});
}
});
});
```
上述代码中,我们首先获取所有的复选框元素,然后给每个复选框绑定一个 `change` 事件。当某个复选框被选中时,我们遍历所有的复选框元素,将除当前选中的复选框外的其他复选框全部设为未选中状态。这样就能保证每次只会有一个复选框被选中。