Question

全新的Javascript和jQuery。我用HTML，CSS和Javascript / jQuery构建了这个Trivia测验并且遇到了问题。

这是我的完整代码 - https://jsfiddle.net/CeeSt/8wLj1pk2/以供参考。

这是我的HTML和JS的片段 -

<div class="question">Question1?
  <ul class="answers">
    <li><label><input name="Question0" id="correct" type="checkbox"> Answer1</label></li>
    <li><label><input name="Question0" id="wrong" type="checkbox"> Answer2</label></li>
    <li><label><input name="Question0" id="wrong" type="checkbox"> Answer3</label></li>
  </ul>
</div>

JS文件 -

var score = 0;

function Results() {
  if (document.getElementById("correct").checked === true) score++;
  else (alert("Incorrect!"));

}

具体来说，我试图以某种方式显示得分总数并且不知所措。我知道它认识到了正确的＆＃39;回答，但随着测验的进展显示这是我正在努力的。我知道在纯JavaScript中可能有更好的方法来做到这一点，但是如果有任何方法来挽救这种方法，请帮忙！谢谢!!

Answer 1

您无法使用id属性执行此操作。但是，您可以使用value属性。

然后，您需要修改分数字段。我认为我没有看到你在那里做过的任何事情。

Answer 2

您应该将它们转换为单选按钮，然后评估所选的单选按钮以检查它是否正确：

<div class="question">Question1?
  <ul class="answers">
    <li><label><input name="Question0" value="correct" type="radio"> Answer1</label></li>
    <li><label><input name="Question0" value="wrong" type="radio"> Answer2</label></li>
    <li><label><input name="Question0" value="wrong" type="radio"> Answer3</label></li>
  </ul>
</div>

你的JS看起来像：

var score = 0;

function Results() {
  if ($("input[name=Question0]:checked").val() == "correct") {
    score++;
  } else {
    alert("Incorrect!");
  }
}

Answer 3

我同意使用单选按钮和值。你可以很容易地计算得分：

var score = $('input:checked[value=correct]').length

请参阅此处的示例：https://jsfiddle.net/wLxr3ooq/

注意：如果您更改＆＃34;值＆＃34;到＆＃34; id＆＃34;它仍然有效...但你应该避免重复ID

Answer 4

我认为问题在于您要为多个元素分配相同的ID，这是不允许的。相反，您可以为它们分配类。因此，在您的情况下，将类错误和类更正分配给您的相应元素。然后，在您的JavaScript中，尝试以下

var x = document.getElementsByClassName("correct");

这将获取类正确的所有元素，并将它们返回到数组中。

试图在简单的HTML和JavaScript Trivia游戏中显示得分

4 个答案: