Question

这是我正在构建的数学练习游戏，它使用随机函数来更改数学问题数字。用户将答案输入文本框，然后单击“检查”按钮检查答案。 fillElements()功能正在运行，但是当我点击“检查”时，我无法从程序中得到响应。到目前为止，我已经排除了很多错误，但这个问题我无法看到或理解。

<body onload="fillElements()">
<form action="math.html">
<ul>
    <li id="num"> </li>
    <li> +</li>
    <li id="num2"> </li>
    <li> =</li>
    <li><input type="text" name="answer" id="answer" /></li>
</ul>   
<button type="button" onclick="validate()">Check</button>
</form>
<script src="javaScript/math.JS"></script>

</body>

// JavaScript的

var totalCorrect= 0;
var totalIncorrect= 0;
var score = math.round(totalCorrect/totalIncorrect);
var message= 'Congrats!, you scored:' + score + 'percent';




function fillElements() {
    firstNum = ['0','1','2','3','4','5','6','7','8','9'];
    secondNum = ['0','1','2','3','4','5','6','7','8','9'];
    var rand= Math.floor((Math.random()*9)+1);
    var rand2= Math.floor((Math.random()*9)+1);

    var el= document.getElementById('num');
     el.textContent = firstNum[rand];
    var el2= document.getElementById('num2');
     el2.textContent = secondNum[rand2];

    }

function validate() {
var userAnswer= number(document.getElementById('answer'));

if (num + num2 === userAnswer) {
    totalCorrect++;
    alert(message);
    fillElements();
    }
else {
    totalIncorrect++;
        alert(message);

}

}

Answer 1

您要获得要比较的value输入，而不是input本身。所以替换以下

var userAnswer= number(document.getElementById('answer'));

带

var userAnswer= number(document.getElementById('answer').value);

Answer 2

它不是number() Number()

Check here

工作代码......

<强> HTML

<form action="math.html">
<ul>
<li id="num"></li>
<li> +</li>
<li id="num2"></li>
<li> =</li>
<li><input type="text" name="answer" id="answer" /></li>
</ul>   
<button type="button" onclick="validate();">Check</button>
</form>

<强>的Javascript

window.onload = function(){
fillElements();
}


function fillElements() {
firstNum = ['0','1','2','3','4','5','6','7','8','9'];
secondNum = ['0','1','2','3','4','5','6','7','8','9'];
var rand= Math.floor((Math.random()*9)+1);
var rand2= Math.floor((Math.random()*9)+1);

var el= document.getElementById('num');
 el.textContent = firstNum[rand];
var el2= document.getElementById('num2');
 el2.textContent = secondNum[rand2];

}


var totalCorrect= 1;
var totalIncorrect= 1;

function validate() {

var userAnswer= Number(document.getElementById('answer').value);

var num = document.getElementById('num').textContent;
var num2 = document.getElementById('num2').textContent;
var valid = Number(num) + Number(num2);


if (valid === userAnswer) {
totalCorrect++;
var score = Math.round(totalCorrect/totalIncorrect);
var message= 'Congrats!, you scored:' + score + 'percent';
alert(message);
fillElements();
}else {
totalIncorrect++;

var score = Math.round(totalCorrect/totalIncorrect);
var message= 'Congrats!, you scored:' + score + 'percent';
    alert(message);

}

}

修改：不要使用

var totalCorrect= 0;
var totalIncorrect= 0;

因为如果你得分，那么它会打印infinity =＆gt; Math.round(1/0);尝试

var totalCorrect= 1;
var totalIncorrect= 1;

Answer 3

Javascript具有案例性，因此您需要使用Math.round，而不是math.round：

var score = Math.round(totalCorrect/totalIncorrect);

要在以后使用变量，您需要在函数外声明它们：

var rand, rand2;

function fillElements() {
  firstNum = ['0','1','2','3','4','5','6','7','8','9'];
  secondNum = ['0','1','2','3','4','5','6','7','8','9'];
  rand = Math.floor((Math.random()*9)+1);
  rand2= Math.floor((Math.random()*9)+1);

  var el= document.getElementById('num');
  el.textContent = firstNum[rand];
  var el2= document.getElementById('num2');
  el2.textContent = secondNum[rand2];

}

要从输入中获取值，您需要使用value属性。要将其转换为数字，请使用Number，而不是number：

var userAnswer = Number(document.getElementById('answer').value);

要检查答案，请使用之前设置的变量。您尚未创建任何变量num和num2。

if (rand + rand2 === userAnswer) {

在数学游戏中检查答案将无法执行

3 个答案: