这是一个使用HTML和JavaScript编写的简单购物计算器。用户可以输入两个数，然后通过点击加、减、乘、除按钮进行计算，结果显示在页面上。JavaScript函数`cal()`处理了四种基本运算逻辑。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<table>
<tr>
<td colspan="3">购物简易计算器</td>
</tr>
<tr>
<td>第一个数</td>
<td colspan="3"><input type="text" id="num1Id"></td>
</tr>
<tr>
<td>第二个数</td>
<td colspan="3"><input type="text" id="num2Id"></td>
</tr>
<tr>
<!-- type说这是个按钮，还是个小圆圈，value就说小圆圈上面写的是什么，onclick是个函数 -->
<td><input type="button" value="+" οnclick="cal('+')"></td>
<td><input type="button" value="-" οnclick="cal('-')"></td>
<td><input type="button" value="*" οnclick="cal('*')"></td>
<td><input type="button" value="/" οnclick="cal('/')"></td>
</tr>
<tr>
<td>计算结果</td>
<!-- type说明这个小按钮，id说明文本框传输的内容 -->
<td colspan="3"><input type="text" id="resultId"></td>
</tr>
</table>
<script type="text/javascript">
function cal(type){
var num1=document.getElementById('num1Id').value;
var num2=document.getElementById('num2Id').value;
switch (type){
case '+':
result = parseInt(num1) + parseInt(num2);
break;
case '-':
result = parseInt(num1) - parseInt(num2);
break;
case '*':
result = parseInt(num1) * parseInt(num2);
break;
case '/':
result = parseInt(num1) / parseInt(num2);
break;
}
document.getElementById('resultId').value=result;
}
</script>
</body>
</html>
------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
扫一扫
500
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
