如何在 JavaScript 中验证多个复选框？答案

【问题标题】：How to validate multiple checkboxes in JavaScript?如何在 JavaScript 中验证多个复选框？
【发布时间】：2022-01-05 01:30:01
【问题描述】：

我有 4 个复选框，我想在前两个复选框被选中但没有得到输出时显示不同的警报。请告诉我哪里出错了。

let ReviewCheckBox = checkform.ratings;
if (ReviewCheckBox[0].checked == true) {
  alert("1 Selected");
} else if (ReviewCheckBox[0].checked == true && ReviewCheckBox[1].checked == true) {
  alert("Both Selected");
}

<div>
  <span>CUSTOMER REVIEWS</span><br>
  <form name="checkform" onclick="productFilter()">
    <input type="checkbox" name="ratings" id="rating-checka">
    <label for="rating-checka">4 * & Above</label><br>

    <input type="checkbox" name="ratings" id="rating-checkb">
    <label for="rating-checkb">3 * & Above</label><br>

    <input type="checkbox" name="ratings" id="rating-checkc">
    <label for="rating-checkc">2 * & Above</label><br>

    <input type="checkbox" name="ratings" id="rating-checkd">
    <label for="rating-checkd">1 * & Above</label>
  </form>
</div>

【问题讨论】：

标签： javascript validation checkbox

【解决方案1】：

1)您必须在选中的每个复选框上进行验证，因此您可以创建一个函数productFilter，它会在您每次选中复选框时运行

2) 您必须先检查0 和1 索引复选框，然后再检查only 0。

function productFilter() {
  let ReviewCheckBox = checkform.ratings;
  if (ReviewCheckBox[0].checked == true && ReviewCheckBox[1].checked == true) {
    alert("Both Selected");
  } else
  if (ReviewCheckBox[0].checked == true) {
    alert("1 Selected");
  }
}

<div>
  <span>CUSTOMER REVIEWS</span><br>
  <form name="checkform" onclick="productFilter()">
    <input type="checkbox" name="ratings" id="rating-checka">
    <label for="rating-checka">4 * & Above</label><br>

    <input type="checkbox" name="ratings" id="rating-checkb">
    <label for="rating-checkb">3 * & Above</label><br>

    <input type="checkbox" name="ratings" id="rating-checkc">
    <label for="rating-checkc">2 * & Above</label><br>

    <input type="checkbox" name="ratings" id="rating-checkd">
    <label for="rating-checkd">1 * & Above</label>
  </form>
</div>

【讨论】：

谢谢。当我简单地从我的代码中删除“else”时，它也可以工作。