好的,所以我的项目是制作一个数学测验网站。我必须随机生成2个数字,用户需要填写数字。用户还需要能够选择他们的操作。现在,我的问题是在我的第二个函数下,我试图通过每个操作,并将计算出的答案与用户输入进行比较。到目前为止,我的代码要么对所有操作都是正的,要么取决于我使用了多少=,它会说对不起。我已经尝试添加另一个条件,如果选中了添加按钮。
`
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<h1><b>Pirate Math</b></h1>
<p id= "bubble"><b>Ahoy Matey!</b> Can you help me practice my math?</p>
<img id = "g1" src = "images/g1_t.png" alt= "Pirate Girl" height="200 px" width = "150px"/>
<ul>
<li><p id = "num1"></p></li>
<li><p id = "opBox"></p></li>
<li><p id = "num2"></p></li>
</ul>
<input type="number" id = "answerBox">
<br>
<br>
<button id= "checkAns">Check Answer</button>
<br>
<br>
<br>
<fieldset>
<h3>Choose your <br> operation!</h3>
<input type="radio" id="op1" name="op" value="add">
<label for="op1"> + </label>
<br>
<input type="radio" id="op2" name="op" value="sub">
<label for="op2"> - </label>
<br>
<input type="radio" id="op3" name="op" value="mult">
<label for="op3"> x </label>
<br>
<input type="radio" id="op4" name="op" value="divide">
<label for="op4"> ÷ </label>
<br>
<button id= "opPick">Click to pick!</button>
</fieldset>
<br>
<p div class="copyright"><em><small>© 2021 Ashley Kohn</small></em></div>
<script>
//button on click op choose
document.getElementById("opPick").addEventListener("click", function operation(){
var op1 = document.getElementById("op1");
var op2 = document.getElementById("op2");
var op3 = document.getElementById("op3");
var op4 = document.getElementById("op4");
console.log("op1 " + op1.checked);
console.log("op2 " + op2.checked);
console.log("op3 " + op3.checked);
console.log("op4 " + op4.checked);
//Addition
if ( op1.checked){
var addNum1 = Math.floor(Math.random() * (20 - 1 + 1));
var addNum2 = Math.floor(Math.random() * (20 - 1 + 1));
console.log("this is with " + (Math.floor(addNum1) + 1));
document.getElementById("num1").innerHTML = addNum1;
document.getElementById("num2").innerHTML = addNum2;
document.getElementById("opBox").innerHTML = "+";
var sum=0;
sum=Number(addNum1)+Number(addNum2);
console.log("SUM is: " + sum);
}
//subtraction
if ( op2.checked){
var subNum1 = Math.floor(Math.random() * (20 - 1 + 1));
var subNum2 = Math.floor(Math.random() * (20 - 1 + 1));
console.log("this is sub " + (Math.floor(subNum1) + 1));
document.getElementById("num1").innerHTML = subNum1;
document.getElementById("num2").innerHTML = subNum2;
document.getElementById("opBox").innerHTML = "−";
var dif=0;
dif=Number(subNum1)-Number(subNum2);
console.log("DIF is: " + dif);
}
//multipulcation
if ( op3.checked){
var multNum1 = Math.floor(Math.random() * (20 - 1 + 1));
var multNum2 = Math.floor(Math.random() * (20 - 1 + 1));
console.log("this is with " + (Math.floor(multNum1) + 1));
document.getElementById("num1").innerHTML = multNum1;
document.getElementById("num2").innerHTML = multNum2;
document.getElementById("opBox").innerHTML = "×";
var prod =0;
prod=Number(multNum1)* Number(multNum2);
console.log("PROd is: " + prod);
}
//division
if ( op4.checked){
var divideNum1 = Math.floor(Math.random() * (20 - 1 + 1));
var divideNum2 = Math.floor(Math.random() * (20 - 1 + 1));
console.log("this is with divide " + (Math.floor(divideNum1) + 1));
document.getElementById("num1").innerHTML = divideNum1;
document.getElementById("num2").innerHTML = divideNum2;
document.getElementById("opBox").innerHTML = "÷";
var divi=0;
divi=Number(divideNum1)/ Number(divideNum2);
console.log("DIVI is: " + divi);
} // closing if
}); // closing function 1
document.getElementById("checkAns").addEventListener("click", function math(){ // supposed to solve the addition
var userNum = document.getElementById("answerBox").value;
var addNum1 = document.getElementById("num1");
var addNum2 = document.getElementById("num2");
var sum = Number(addNum1) + Number(addNum2);
var subNum1 = Math.floor(Math.random() * (20 - 1 + 1));
var subNum2 = Math.floor(Math.random() * (20 - 1 + 1));
var dif = Number(subNum1)-Number(subNum2);
var multNum1 = Math.floor(Math.random() * (20 - 1 + 1));
var multNum2 = Math.floor(Math.random() * (20 - 1 + 1));
var prod = Number(multNum1)* Number(multNum2);
var divideNum1 = Math.floor(Math.random() * (20 - 1 + 1));
var divideNum2 = Math.floor(Math.random() * (20 - 1 + 1));
var divi = Number(divideNum1)/ Number(divideNum2);
if (Number(sum) == Number(userNum)){
console.log("yay!");
}//if statement closed
/*else if (dif = Number(userNum) && op2.checked){
console.log("yay!");
}//if statement closed
else if (prod = Number(userNum) && op3.checked){
console.log("yay!");
}//if statement closed
else if (divi = Number(userNum)&& op4.checked){
console.log("yay!");
}//if statement closed */
else{
console.log("sorry!");
}
})//closing function 2`
var addNum1 = document.getElementById("num1");
获取元素,您需要在其中获取值。尝试addNum1.value
访问该值。目前,它总是计算为true,因为您正在比较两个对象。
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Equality_comparisons_and_sameness