Question

我正在用Java进行测验，我希望能够一遍又一遍地使用相同的按钮来获取答案，而无需重新加载页面。这是我的代码：

    document.getElementById("nextBtn").addEventListener("click", function() {
      let answers = document.getElementById('answers').value;
      let inputAns = [0, 1, 2];
      for (var i = 0; i < inputAns.length; i++) {
        if (answers == inputAns[i]) {
          document.getElementById("correctAnswers").innerHTML = "&#9989;";
          inputAns++;
      } else { 
          document.getElementById("incorrectAnswers").innerHTML = "&#10060;";
         inputAns++;
      }
      }
      });

和

<button type="submit" id="nextBtn" class="nextBtn">NEXT!</button>
 </div>

<div class="correctAnswers" id="correctAnswers"></div>
<div class="incorrectAnswers" id="incorrectAnswers"></div>

因此，当按下按钮（nextBtn）时，它将读取输入栏（答案）并检查是否与数组的输入（inputAns）匹配。如果匹配，则显示绿色复选标记。如果不是，则会显示红色的x。然后，循环将添加到数组中，以更改下一个问题的答案。这工作一次。但是当再次按下按钮时，什么也没有发生。如何使函数重复执行，以便可以检查更多问题，并且可以显示复选标记或x？谢谢！

ETA：更多HTML

Answer 1

您要做的第一件事是将.innerHTML附加而不是替换（用+=）。

您还需要在条件中使用 true等于，否则空答案将与0一样对待，因此对于第一个答案。如果这样做，您还想利用parseInt(answers)而不只是answers。

此后，您将需要将输入数组移出函数之外，并设置一个当前答案变量。这应该引用数组的第一个索引。

从这里开始，您将希望完全删除循环，只需在“成功”条件内运行inputAns.shift()即可；这将删除数组中的第一个元素。因此，您可以对currentAnswer = inputAns[0]进行比较。如果删除了第一个元素，则将答案与第二个元素进行比较，依此类推，直到给出所有答案为止。

最后，输入所有答案后，您可能希望添加一条消息或“停止”条件。可以通过选中if (!inputAns.length)来完成。

下面可以看到，正确的答案依次为0，1，12`：

let inputAns = [0, 1, 2];
let currentAnswer = inputAns[0];

document.getElementById("nextBtn").addEventListener("click", function() {
  let answers = document.getElementById('answers').value;
  if (parseInt(answers) === currentAnswer) {
    document.getElementById("correctAnswers").innerHTML += "&#9989;";
    inputAns.shift();
    if (!inputAns.length) {
      console.log("All answers provided!");
    }
  } else {
    document.getElementById("incorrectAnswers").innerHTML += "&#10060;";
  }
  currentAnswer = inputAns[0];
});

<input id="answers" />

<button id="nextBtn">Next</button>

<div id="correctAnswers"></div>
<div id="incorrectAnswers"></div>

Javascript-要反复按下按钮并具有相同的功能触发器

1 个答案: