JavaScript实现的超简单计算器功能示例
程序员文章站
2023-01-28 16:16:09
本文实例讲述了javascript实现的超简单计算器功能。分享给大家供大家参考，具体如下：
先来看看运行效果：
具体代码：
本文实例讲述了javascript实现的超简单计算器功能。分享给大家供大家参考，具体如下：
先来看看运行效果：
具体代码：
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>www.jb51.net js计算器</title>
<script type="text/javascript">
// window.onload 获取元素getelementbyid
window.onload = function(){
var otxt1 = document.getelementbyid('val01');
var otxt2 = document.getelementbyid('val02');
var ofuhao = document.getelementbyid('fuhao');
// 这三个要放在button函数里面，因为s1.value是获取input里面的输入，但是这个时候还没有输入了
// var inum1 = otxt1.value;
// var inum2 = otxt2.value;
// var inum3 = ofuhao.value;
obtn = document.getelementbyid('btn');
// 计算按钮点击事件
obtn.onclick = function(){
var inum1 = otxt1.value;
var inum2 = otxt2.value;
var inum3 = ofuhao.value;
var iresult;
//如果两个输入有一个是空的话 //return是让if里面执行结束
if (inum1=='' || inum2=='') {
alert('不能为空');
return;
} //isnan() 如果是true，说明是非数字，所以如果两个输入中有非数字，就提示alert
if (isnan(inum1) || isnan(inum2)) {
alert('不能有字母');
return;
} //对+-*/四个操作对应的value进行判断 //如果直接inum1+inum2 输出的结果是字符串的拼接 12+24 1224 所以要转换成parseint整数
if (inum3 == 0) {
iresult = parseint(inum1) + parseint(inum2)
}
else if (inum3 == 1) {
iresult = parseint(inum1) - parseint(inum2)
}
else if (inum3 == 2) {
iresult = parseint(inum1) * parseint(inum2)
}
else if (inum3 == 3) {
iresult = parseint(inum1)/parseint(inum2)
}
alert(iresult);
}
}
</script>
</head>
<body>
<h3>计算器</h3>
<input type="text" id="val01">
<select id="fuhao">
<option value="0">+</option>
<option value="1">-</option>
<option value="2">*</option>
<option value="3">/</option>
</select>
<input type="text" id="val02">
<input type="button" id="btn" value="计算">
</body>
</html>
ps：这里再为大家推荐几款计算工具供大家进一步参考借鉴：
在线一元函数（方程）求解计算工具：
科学计算器在线使用_高级计算器在线计算：
在线计算器_标准计算器：
更多关于javascript相关内容感兴趣的读者可查看本站专题：《javascript数学运算用法总结》、《javascript数据结构与算法技巧总结》、《javascript数组操作技巧总结》、《javascript事件相关操作与技巧大全》、《javascript操作dom技巧总结》及《javascript字符与字符串操作技巧总结》
希望本文所述对大家javascript程序设计有所帮助。
下一篇： 一个坚称打印机没有粉墨要换了它的人