我正在尝试制作一个简单的计算器,只需按一下按钮即可将 2 个数字相加。我已经完成了 HTML 部分,但我不知道如何让按钮添加数字。我尝试过使用事件监听器,但我可能遗漏了一些东西。如果可以的话,请编写脚本,同时解释最重要的代码行。谢谢!
<html>
<head>
<title>A calculator... I guess?</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<div class="main">
<div class="container" style="margin: 100px 200px 0 200px">
<!-- Inputs -->
<p>1st number</p>
<input type="number" id="one">
<p>2nd number</p>
<input type="number" id="two>">
<!-- Button -->
<br>
<br>
<button id="add">Calculate</button>
<!-- Result -->
<p>Result</p>
<input type="text" id="result">
</div>
</div>
<script>
</script>
</body>
</html>
最佳答案
<html>
<head>
<title>A calculator... I guess?</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<div class="main">
<div class="container" style="margin: 100px 200px 0 200px">
<!-- Inputs -->
<p>1st number</p>
<input type="number" id="one">
<p>2nd number</p>
<input type="number" id="two">
<!-- Button -->
<br>
<br>
<button id="add" onClick={calculate()}>Calculate</button>
<!-- Result -->
<p>Result</p>
<input type="text" id="result">
</div>
</div>
<script>
var elementOne =document.getElementById('one');
var elementTwo =document.getElementById('two');
function calculate(){
one = parseInt(elementOne.value)
two = parseInt(elementTwo.value)
document.getElementById('result').value = one + two;
}
</script>
</body>
</html>
关于javascript - 如何在输入中显示加法结果,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/71196479/