AI智能问答-学无止境 AI解答 javascript 多个复选框 选中一个,其他复选框禁用如何实现

javascript 多个复选框 选中一个,其他复选框禁用如何实现

你可以使用JavaScript来实现多个复选框中选中一个后禁用其他复选框的功能。下面是一个实现的示例代码:

HTML部分:
“`html
<input type="checkbox" id="checkbox1" onclick="disableOtherCheckboxes(this)">
<input type="checkbox" id="checkbox2" onclick="disableOtherCheckboxes(this)">
<input type="checkbox" id="checkbox3" onclick="disableOtherCheckboxes(this)">
“`

JavaScript部分:
“`javascript
function disableOtherCheckboxes(checkbox) {
var checkboxes = document.querySelectorAll(‘input[type="checkbox"]’);
for (var i = 0; i < checkboxes.length; i++) {
if (checkboxes[i] !== checkbox) {
checkboxes[i].disabled = checkbox.checked;
}
}
}
“`

在上面的示例中,我们给每个复选框添加了一个`onclick`事件处理函数`disableOtherCheckboxes`。当复选框被点击时,该函数会被调用。

函数`disableOtherCheckboxes`首先通过`document.querySelectorAll`方法获取到所有的复选框元素,然后使用一个循环遍历这些复选框。在循环中,如果当前复选框不是被点击的复选框,则将其`disabled`属性设置为被点击复选框的`checked`属性值。

这样,当你选中一个复选框时,其他复选框就会被禁用。

上一篇
下一篇

发表回复

返回顶部