主页 / 问题 / 966312
Accepted
Павел Рыбакин
Asked:2020-04-06 23:32:20 +0000 UTC2020-04-06 23:32:20 +0000 UTC

重置按下的单选框和复选框。限制点击复选框的数量

  • 772

我正在用 javascript 创建一个训练测试，当 backstart () 函数重置按下的复选框和收音机时，我需要这样做。您还需要确保用户在一个问题中只能选中 5 个复选框中的 3 个。

var rez=0,
d=document;
function v3(){
  for(i=0; i<d.getElementsByName("q3").length; i++){

      if(d.getElementsByName("q3")[i].checked) {

        if(i==0){rez+=2;}
        if(i==2){rez+=2;}
        if(i==3){rez+=1;}
      }

  }
alert(rez);

}
<div id="v3" class="qdiv">
          <p class="quest">Для облика древнейшего человека характерны:</p><br>
          <label><input type="checkbox" name="q3" value="1" />выступающие челюсти</label><br><br>
          <label><input type="checkbox" name="q3" value="2" />прямая походка</label><br><br>
          <label><input type="checkbox" name="q3" value="3" />прыгающая походка</label><br><br>
          <label><input type="checkbox" name="q3" value="4" />руки, свисающие ниже колен</label><br><br>
          <a href="#" onclick="v3()" class="btnflip">
             ответить
          </a>
        </div>

javascript

1 个回答

  1. Best Answer

    一。

    document.querySelectorAll("input[type='radio'],input[type='checkbox']").
  forEach(el => el.checked = false);

    2.

    document.querySelectorAll(".qdiv input[type='checkbox']").forEach(el => {
  el.addEventListener("click", function(e){
    if (this.checked) {
      var count = this.closest(".qdiv").querySelectorAll("input[type='checkbox']:checked").length;
      if (count > 3)
        this.checked = false;
    }
  });
});
    <div id="v3" class="qdiv">
  <p class="quest">Для облика древнейшего человека характерны:</p><br>
  <label><input type="checkbox" name="q3" value="1" />выступающие челюсти</label><br><br>
  <label><input type="checkbox" name="q3" value="2" />прямая походка</label><br><br>
  <label><input type="checkbox" name="q3" value="3" />прыгающая походка</label><br><br>
  <label><input type="checkbox" name="q3" value="4" />руки, свисающие ниже колен</label><br><br>
  <a href="#" onclick="v3()" class="btnflip">
    <span class="btnflip-item btnflip__front">Ответить</span>
    <span class="btnflip-item btnflip__center"></span>
    <span class="btnflip-item btnflip__back">Далее</span>
  </a>
</div>

    • 2

相关问题