JavaScript 允许一个复选框或一组复选框_JavaScript

我有一个带有四个复选框的 div，应该允许用户选择第一个复选框或两个、三个和四个的组合，但不能一起选择。 示例场景：

第一个复选框或第二个复选框
第一个复选框或第三个复选框
第一个复选框或第四个复选框
第一个复选框或（第二个和第三个）
第一个复选框或（第三个和第四个）
第一个复选框或（第二个和第四个）
第一个复选框或（第二个和第三个和第四个）

div 是这样的：

<div class="question" id="someFilters">
    <label>Some Suppliers</label>
        <div class="someclass">
            <form:checkbox id="firstcheckbox" value="First checkbox"/>
                <label class="inputtext">First Checkbox</label>
            <form:checkbox id="secondcheckbox" value="Second checkbox"/>
                <label class="inputtext">Second Checkbox</label>
            <form:checkbox id="thirdcheckbox" value="Third checkbox"/>
                <label class="inputtext">Third Checkbox</label>
            <form:checkbox id="fourthcheckbox" value="Fourth checkbox"/>
                <label class="inputtext">Fourth Checkbox</label>
        </div>
</div>

任何帮助深表感谢。

您描述的条件的逻辑很简单：
不得选中第一个框或不得选中所有其他框。

将根据是否满足该条件为该脚本中的valid变量分配一个布尔值。 这个赋值语句有效，因为变量cs之前已经被分配了一个包含所有输入元素的 NodeList（通过.querySelectorAll("input") - 尽管你可能想要使用一个选择器，它按名称或类或其他一些元素来定位元素）属性。）

请注意，您发布的 html 格式不正确。 具体来说， <form:checkbox />不代表一个 html 元素。

 const cs = document.querySelectorAll("input"); document.querySelector("button").addEventListener("click", validate); function validate(){ const valid = !cs[0].checked || !cs[1].checked && !cs[2].checked && !cs[3].checked; console.log(valid ? "good" : "bad"); }

 <input type="checkbox" />1 <input type="checkbox" />2 <input type="checkbox" />3 <input type="checkbox" />4 <br /> <button type="button">Validate</button>

JavaScript 允许一个复选框或一组复选框

问题描述

1楼