Question

我正在开发一个表格，应根据您的最终得分显示不同的结果。目前，它只显示底部的附加分数，并且只有在您点击任何无线电输入（Q1或Q2）时才会更新。

在添加问题中的所有值时，如果您同时填写问题1和问题2，则问题3的值会加倍。

我认为这是javascript函数中的内容，但我该如何解决？

<body>
  <div class="q1 question">
    <h4 class="question">1. Com que frequência tem perdas de urina? (Escolha uma opção):</h4>
      <form>
        <label><input type="radio" name="q1" value="0"> Nunca</label><br>
        <label><input type="radio" name="q1" value="1"> Uma vez por semana ou menos</label><br>
        <label><input type="radio" name="q1" value="2"> Duas ou três vezes por semana</label><br>
        <label><input type="radio" name="q1" value="3"> Uma vez por dia</label><br>
        <label><input type="radio" name="q1" value="4"> Várias vezes por dia</label><br>
        <label><input type="radio" name="q1" value="5"> Constantemente</label>
      </form>
  </div>
  <div class="q2 question">
    <h4 class="question">2. Gostaríamos de saber a quantidade de urina que acha que perde.<br>Que quantidade de urina costuma perder?<br>(Quer use ou não protecção) (Escolha uma opção)</h4>
      <form>
        <label><input type="radio" name="q2" value="0"> Nenhuma</label><br>
        <label><input type="radio" name="q2" value="2"> Uma quantidade pequena</label><br>
        <label><input type="radio" name="q2" value="4"> Uma quantidade moderada</label><br>
        <label><input type="radio" name="q2" value="6"> Uma grande quantidade</label>
      </form>
  </div>
  <div class="q3 question">
    <h4 class="question">3. No geral, a perda de urina interfere muito no seu dia-a-dia?<br>Escolha entre 0 (nada) e 10 (bastante)</h4>
      <form>
        <input type="range" name="q3" id="q3" value="5" min="0" max="10" oninput="cOut.value = q3.value" style="width: 300px;"><br>
        <output name="cOutName" id="cOut">5</output>
      </form>
  </div>


  <div class="result"></div>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>

  <script type="text/javascript">
    /* ADDING VALUES */
    var $inputs = $('.question input[type=radio]').on('change', function() {
        var total = 0;
        $inputs.filter(':checked').each(function() {
            total += +this.value;
            total += +document.getElementById('q3').value;
        })

        $('.result').text(total);
    });

  </script>
</body>

Answer 1

总计+ = + document.getElementById（＆＃39; q3＆＃39;）。值;

您在每个函数中使用此行，因此对于每个选中的选项，它将采用q3的值。

试试这个： -

var $inputs = $('.question input[type=radio]').on('change', function() {
        var total = 0;
        var q3 = document.getElementById('q3').value;
        $inputs.filter(':checked').each(function() {
            total += +this.value;

        });
        total += +q3 ;

        $('.result').text(total);
    });

Answer 2

你的q3值正在加倍，因为当你检查了两个问题时，将q1和q2的值添加到q3的循环运行两次，因为有两个选中的项目。

要解决这个问题，请拉下这一行： total + = + document.getElementById（'q3'）。value;

退出'已检查'循环并将其置于下方。

希望有所帮助！

表格从答案两次增加值

2 个答案: