javascript - 在数学游戏中检查答案不会执行

标签 javascript html

这是我正在构建的一个数学练习游戏,它使用随机函数来更改数学问题的数字。用户将答案输入文本框,然后通过单击“检查”按钮检查答案。 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);

}

}

最佳答案

这不是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 => Math.round(1/0); try

var totalCorrect= 1;
var totalIncorrect= 1;

关于javascript - 在数学游戏中检查答案不会执行,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31363485/

相关文章:

html - 在 JSON 字符串中 react i18n 换行

javascript - IE 11 在使用 HTML input=file 标签时锁定文件

javascript - Atom 错误的自动完成

jquery - CSS 过渡显然不适用

javascript - HTML 表单值不会推送到 JavaScript 数组

javascript - 使用详细信息和摘要标签作为可折叠的内联元素

javascript - 第二列和第三列中的图像在悬停时随机消失

javascript - 如何修复 "member not found"- Javascript 中的错误

javascript - Noob Javascript 自动总计

javascript - jQuery Sidebar Sliding Menu - 将按钮链接到特定幻灯片,每个链接都没有重复功能