两款简易计算器纯js版附源码下载

来源:互联网 发布:windows ssh使用 编辑:程序博客网 时间:2024/05/16 05:52

效果如图:


js代码如下,

<!DOCTYPE html><html><head><link rel="stylesheet" href="style.css"></head><body><input type="text" class="" id="res" readonly value=""><br><input type="text" class="" id="input" readonly value=""><table><tr><td><button id="+" onclick="operate(this)">+</button></td><td><button id="-" onclick="operate(this)">-</button></td><td><button id="*" onclick="operate(this)">*</button></td><td><button id="/" onclick="operate(this)">/</button></td></tr><tr><td><button id="" onclick="getNum(this)">7</button></td><td><button id="" onclick="getNum(this)">8</button></td><td><button id="" onclick="getNum(this)">9</button></td><td><button id="" onclick="backspace()"><-</button></td></tr><tr><td><button id="" onclick="getNum(this)">4</button></td><td><button id="" onclick="getNum(this)">5</button></td><td><button id="" onclick="getNum(this)">6</button></td><td><button id="" onclick="clearInput()">C</button></td></tr><tr><td><button id="" onclick="getNum(this)">3</button></td><td><button id="" onclick="getNum(this)">2</button></td><td><button id="" onclick="getNum(this)">1</button></td><td rowspan="2"><button id="equ" onclick="calculator()">=</button></td></tr><tr><td colspan="2"><button id="zero" onclick="getNum(this)">0</button></td><td><button id="" onclick="getNum(this)">.</button></td></tr></table></body><script type="text/javascript">var num_a = null;var num_b = null;var op = null;var init = false;//清空function clearInput() {init = false;document.getElementById("res").value = "";document.getElementById("input").value = "";}//退格function backspace() {//计算出来的结果不能退格if (init) return;var value = document.getElementById("input").value;document.getElementById("input").value = value.substring(0, value.length-1);}//显示点击的数字function getNum(obj) {//计算出结果后继续点数字则自动清空前一个算式if (init) clearInput();var Num = obj.innerHTML;var value = document.getElementById("input").value;if (Num == ".") {if (value == null || value == "") return;//开头不能是小数点if (value.indexOf(".") >= 0) return;//不能有多个小数点}document.getElementById("input").value += Num;}//+-*/ 操作function operate(obj){var value = document.getElementById("input").value;if (!cofrim(value)) {return;}document.getElementById("input").value = "";value = parseFloat(value);num_a = value;op = obj.id;document.getElementById("res").value = num_a + op;}//验证function cofrim(value) {if (value == null || value == "") {alert("您还没有输入数值,请输入");return false;}value = parseFloat(value);if (isNaN(value)) {alert("您输入有误,请输入数值");return false;}return true;}//计算function calculator() {var value = document.getElementById("input").value;if (!cofrim(value)) {return;}value = parseFloat(value);document.getElementById("input").value = "";if (op == "+") {num_b = value + num_a;} else if (op == "-") {num_b = num_a - value;} else if (op == "*") {num_b =  value * num_a;} else if (op == "/") {num_b = num_a / value;}document.getElementById("res").value += value + "=";document.getElementById("input").value = num_b;init = true;}</script></html>


还有一款更简易的


下载地址:
链接:http://pan.baidu.com/s/1o8MEQwE 密码:3ssf
原创粉丝点击