[英]Need help getting output to show using Javascript
I need to show the output (sum, difference, product, quotient) of the 2 numbers in the span below the form. 我需要在表格下方的跨度中显示2个数字的输出(总和,差,乘积,商)。 I have tried many variations but cannot get the sum and etc to show at all.
我尝试了许多变体,但根本无法得到总和等。 Please help I'm a Javascript noob!!!
请帮助我是Java语言的菜鸟!!! Thanks!
谢谢!
function calculate() {
'use strict';
// Read the first text box and convert to a float
var input = document.getElementById('number1').value;
var number1 = parseInt(input);
var input = document.getElementById('number2').value;
var number2 = parseInt(input);
// Calculations
sum = number1 + number2;
difference = number1 - number2;
product = number1 * number2;
quotient = number1 / number2;
// Display the results in relevant spans
document.getElementById('sum').value = sum;
document.getElementById('difference').value = difference;
document.getElementById('product').value = product;
document.getElementById('quotient').value = quotient;
return false;
}
function init() {
'use strict';
document.getElementById('theForm').onsubmit = calculate;
}
window.onload = init;
HTML HTML
<form action="" method="post" id="theForm">
<fieldset>
<div><label for="number1">Number 1</label>
<input type="text" name="number1" id="number1" required>
</div>
<div><label for="number2">Number 2</label>
<input type="text" name="number2" id="number2" required>
</div>
<br />
<div><input type="submit" value="Calculate"></div>
</fieldset>
</form>
<span id="sum"></span><br />
<span id="difference"></span><br />
<span id="product"></span><br />
<span id="quotient"></span><br />
To assign value to a span tag, we need to use innerHTML
property, not value
. 要将值分配给span标签,我们需要使用
innerHTML
属性,而不是value
。
document.getElementById('sum').innerHTML = sum;
document.getElementById('difference').innerHTML = difference;
document.getElementById('product').innerHTML = product;
document.getElementById('quotient').innerHTML = quotient;
And Change 和改变
<form action="" method="post" id="theForm">
to 至
<form action="" method="post" id="theForm" onsubmit="return calculate()">
You just have to invoke the calculate
function on form's submission. 您只需要在表单提交时调用
calculate
函数即可。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.