我在尝试使用 html 和 Javascript 制作计算器时陷入困境



对于一个学校项目,我必须使用html和Javascript制作一个计算器。应该有三个输入框,一个输入第一个数字,一个输入第二个数字,第三个猜测正确答案。下面应该有一个按钮来计算。

计算器必须能够做到: +, -, :, *, 模数

第三个框应该用于输入一个自我猜测的答案,然后在计算之后,必须有一个弹出窗口,上面写着错误的答案,或者正确的答案。

但是现在我陷入了困境,我创建了所有输入框,计算器能够添加数字。但我只是不知道该怎么做剩下的。有人可以帮我解决这个问题吗?

这是我现在的代码: (里面有几个荷兰语单词。"Getal"的意思是:数字。"Uitkomst"的意思是:答案"berekenSom"的意思是:计算)

<!DOCTYPE html>
<html>
<head>
<title>Calculator</title>
<style>
h3 {
color: green;
}
</style>
</head>
<body>
<pre>
<h2>Javascript Calculator</h2>
Insert first number:   <input type="number" id="getal_1">
Insert second number:  <input type="number" id="getal_2">

My own calculation:    <input type="number" id="getal_3">
<h3 id="uitkomst" >The answer is:</h3>
<button id="button">Calculate</button>
</pre>
</body>
</html>
<script>
document.getElementById("button").onclick = berekenSom;
var uitkomst = document.getElementById("uitkomst");


function berekenSom() {
var getal1 = document.getElementById("getal_1").value;

var getal2 = document.getElementById("getal_2").value;
var som = parseFloat(getal1) + parseFloat(getal2);
uitkomst.style.color = "red";
uitkomst.innerHTML = "The calculation " + getal1 + " + " + getal2 + " = " + som;
}
</script>

如果有人能帮我解决这个问题,我将不胜感激,因为我现在有点卡住了。

提前谢谢。

好的,我为您完成了"+"功能。由于这是一个学校项目,我将尽量不为你做整个事情。如果您需要更多帮助,请询问:)

document.getElementById("button").onclick = berekenSom;
var uitkomst = document.getElementById("uitkomst");
function berekenSom() {
var getal1 = parseFloat(document.getElementById("getal_1").value); 
var getal2 = parseFloat(document.getElementById("getal_2").value);
var getal3 = parseFloat(document.getElementById("getal_3").value);

var op = document.getElementById("operation")
var select = op.options[op.selectedIndex].value;

var som;

if (select == "+") {
var som = getal1 + getal2;
}

if (getal3 == som) {
uitkomst.style.color = "green";
} else {
uitkomst.style.color = "red";
}
uitkomst.innerHTML = "The calculation " + getal1 + " " + select + " " + getal2 + " = " + som;
}
h3 {
color: green;
}
#uitkomst {
color: blue;
}
<pre>
<h2>Javascript Calculator</h2>
Insert first number:   <input type="number" id="getal_1">
Insert second number:  <input type="number" id="getal_2">

My own calculation:    <input type="number" id="getal_3">

Operation:             <select id="operation">
<option value="+">Plus</option>
<option value="-">Minus</option>
<option value="/">Divide</option>
<option value="*">Multiply</option>
</select>
<h3 id="uitkomst" >The answer is:</h3>
<button id="button">Calculate</button>
</pre>

最新更新