我的代码有问题,因为当我点击";新的";onclick按钮。请帮帮我。谢谢
<!DOCTYPE html>
<html>
<title>MATH FLASHCARD 1.0</title>
<head>
<link rel="stylesheet" href="style.css">
<script>
var operators = [{
sign: "+",
method: function(num1,num2){ return num1 + num2; }
},{
sign: "-",
method: function(num1,num2){ return num1 - num2; }
}];
var selectedOperator = Math.floor(Math.random()*operators.length);
operators[selectedOperator].sign //this will give you the sign
operators[selectedOperator].method(rnum1, rnum2) //this will give you the answer
function New()
{
num1 = document.getElementById("num1");
num2 - document.getElementById("num2");
rnum1 = Math.floor((Math.random()*10)+1);
rnum2 = Math.floor((Math.random()*10)+1);
num1.innerHTML=rnum1
num2.innerHTML=rnum2
}
</script>
</head>
<h2>MATH FLASHCARDS V1.0</h2>
<body>
<div>
<div id="num1"></div><!--end of num1-->
<div id="num2"></div><!--end of num2-->
<div id="operators"></div><!--end of operator-->
<div id="answer"></div><!--end of answer-->
<button onclick="New()">New</button>
学习如何读取控制台中的错误。在这种情况下,错误可以清楚地解释代码的错误。
首先,声明变量。
然后把确定答案的代码放在函数中,这样它就被实际调用了。
然后调用该函数并实际对输出执行一些操作。我刚把它放进控制台。
var num1, num2, rnum1, rnum2, sign, answer;
var operators = [{
sign: "+",
method: function(num1, num2) {
return num1 + num2;
}
}, {
sign: "-",
method: function(num1, num2) {
return num1 - num2;
}
}];
New();
function New() {
num1 = document.getElementById("num1");
num2 = document.getElementById("num2");
rnum1 = Math.floor((Math.random() * 10) + 1);
rnum2 = Math.floor((Math.random() * 10) + 1);
num1.innerHTML = rnum1
num2.innerHTML = rnum2
var selectedOperator = Math.floor(Math.random() * operators.length);
sign = operators[selectedOperator].sign //this will give you the sign
answer = operators[selectedOperator].method(rnum1, rnum2) //this will give you the answer
console.log('sign:', sign, 'answer:', answer);
}
<h2>MATH FLASHCARDS V1.0</h2>
<div>
<div id="num1"></div>
<!--end of num1-->
<div id="num2"></div>
<!--end of num2-->
<div id="operators"></div>
<!--end of operator-->
<div id="answer"></div>
<!--end of answer-->
<button onclick="New()">New</button>
</div>
也许这就是您要寻找的结果:
let operators = [{
sign: "+",
method: function(num1, num2) {
return num1 + num2;
}
}, {
sign: "-",
method: function(num1, num2) {
return num1 - num2;
}
}];
function New() {
const num1 = document.getElementById("num1");
const num2 = document.getElementById("num2");
const operatorEl = document.getElementById("operators");
const answerEl = document.getElementById("answer");
const rnum1 = Math.floor((Math.random() * 10) + 1);
let rnum2;
do{
rnum2 = Math.floor((Math.random() * 10) + 1)
}while(rnum2 > rnum1)
const selectedOperator = Math.floor(Math.random() * operators.length);
const operator = operators[selectedOperator] //this will give you the sign
const answer = operator.method(rnum1, rnum2) //this will give you the answer
num1.innerHTML = rnum1
num2.innerHTML = rnum2
operatorEl.innerHTML = operator.sign;
answerEl.innerHTML = answer
}
<h2>MATH FLASHCARDS V1.0</h2>
<div>
<div id="num1"></div>
<!--end of num1-->
<div id="num2"></div>
<!--end of num2-->
<div id="operators"></div>
<!--end of operator-->
<div id="answer"></div>
<!--end of answer-->
<button onclick="New()">New</button>
</div>