<!DOCTYPE HTML><html><head><script type="text/javascript">function resCalc(){numA=document.getElementById("num_a").value;numB=document.getElementById("num_b").value;document.getElementById("result").value=Number(numA)+Number(numB);}</script></head><body><p>使用 output 元素的简易计算器:</p><form onsubmit="return false"> <input id="num_a" /> + <input id="num_b" /> = <output id="result" onforminput="resCalc()"></output></form></body></html>
2 回答
已采纳
Lemonade_h
TA贡献3条经验 获得超5个赞
<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript">
window.onload = function (){
var aSum = document.getElementById('sum');
aSum.onclick = function (){
var aNumOne = document.getElementById('num_a');
var aNumTwo = document.getElementById('num_a');
//将两个数字的和 存到一个变量里面 便于观看
var oSum = parseFloat(aNumOne.value) + parseFloat(aNumTwo.value);
var result = document.getElementById('result');
result.innerHTML = oSum;
}
}
</script>
</head>
<body>
<p>使用 output 元素的简易计算器:</p>
<input id="num_a" /> +
<input id="num_b" /> =
<output id="result"></output><br>
<button id="sum">计算</button>
</body>
</html>output 没有value这个属性 所以只能改变 它的 innerHTML 我没有将你的output移出,我在布局里面添加了一个可以点击计算的按钮button 还有就是 简易计算器 我就没有帮你写判断是否是数字,有兴趣的话可以去网上搜一下。
我在这里还是建议你用一个span 去承载这两个数字之和。下面是W3C里面介绍output的用法:
output:
定义和用法
<output> 标签定义不同类型的输出,比如脚本的输出。
实例
如何在表单中使用 output 元素:
<form action="form_action.asp" method="get" name="sumform"><output name="sum"></output></form>
HTML 4.01 与 HTML 5 之间的差异
<output> 标签是 HTML 5 中的新标签。
损失函数
TA贡献114条经验 获得超93个赞
<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript">
function resCalc()
{
numA=document.getElementById("num_a").value;
numB=document.getElementById("num_b").value;
document.getElementById("result").value=Number(numA)+Number(numB);
}
</script>
</head>
<body>
<p>使用 output 元素的简易计算器:</p>
<form onsubmit="return false">
<input id="num_a" /> +
<input id="num_b" /> =
<input id="result" onclick="resCalc()" />
</form>
</body>
</html>望采纳!
- 2 回答
- 0 关注
- 1705 浏览
相关问题推荐
添加回答
举报
0/150
提交
取消
