对于学校项目,我必须使用html和Javascript制作计算器。应该有三个输入框,一个用于输入第一个数字,一个用于输入第二个数字,第三个用于猜测正确的答案。下面应该有一个按钮来计算。
计算器必须能够:+, - ,:,*,modulo
第三个框应该用于输入一个自我猜测的答案,然后在计算之后,必须弹出一个错误答案或正确答案。
但是现在我陷入困境,我创建了所有输入框,计算器可以添加数字。但我只是不知道如何做其余的事情。有人可以帮我解决这个问题吗?
这是我现在的代码: (那里有几个荷兰语。“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>
如果有人可以帮助我,我会非常感激,因为我现在有点卡住了。
提前致谢。
答案 0 :(得分:0)
好的,我为你做了“+”功能。既然这是一个学校项目,我会尽量不为你做整件事。如果您需要更多帮助,请询问:)
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>