当比较用户输入和数字总和时,If语句返回true



好的,所以我的项目是制作一个数学测验网站。我必须随机生成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"> &#xf7; </label>

<br>
<button id= "opPick">Click to pick!</button>
</fieldset> 
<br>


<p div class="copyright"><em><small>&copy; 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 = "&#43;";


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 = "&#8722";


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 = "&#215;";


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 = "&#247;";


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

最新更新