用JS寫的一個微型計算器

主要界面就很簡單了,就是用了幾個button,沒有執着太多的前端代碼,所以出來的頁面是很醜的,主要是看js實現過程;

<body>
<form action="">
<table>
<tr>
<input id="result">
</tr>
<tr>
<td><input id="1" type="button" value="1" name="1"
οnclick="SetNum(this)"></td>
<td><input id="2" type="button" value="2" name="2"
οnclick="SetNum(this)">
<td><input id="3" type="button" value="3" name="3"
οnclick="SetNum(this)">
<td><input id="+" type="button" value="+"
οnclick="SetOp(this.value)">
</tr>
<tr>
<td><input id="4" type="button" value="4" name="4"
οnclick="SetNum(this)">
<td><input id="5" type="button" value="5" name="5"
οnclick="SetNum(this)">
<td><input id="6" type="button" value="6" name="6"
οnclick="SetNum(this)">
<td><input id="-" type="button" value="-"
οnclick="SetOp(this.value)">
</tr>
<tr>
<td><input id="7" type="button" value="7" name="7"
οnclick="SetNum(this)">
<td><input id="8" type="button" value="8" name="8"
οnclick="SetNum(this)">
<td><input id="9" type="button" value="9" name="9"
οnclick="SetNum(this)">
<td><input id="*" type="button" value="*"
οnclick="SetOp(this.value)">
</tr>
<tr>
<td><input id="C" type="reset" value="C" name="C">
<td><input id="0" type="button" value="0" name="0"
οnclick="SetNum(this)">
<td><input id="/" type="button" value="/"
οnclick="SetOp(this.value)">
<td><input id="submit" type="button" value="=" οnclick="sub()">
</tr>
</table>
</form>
</body>

主要是js的部分,由於是初次寫,邏輯也是很亂(哈哈)

<script type="text/javascript">
var m = 0; //第一次輸入的值
var n = 0; //第二次輸入的值
var num = ""; //連接輸入的字符串的中介
var sum = 0; //結果
var select = "";  //保存運算符
function SetNum(obj) {
var arr = "0123456789";
for (var i = 0; i < 10; i++) {
if (obj.value == arr.charAt(i)) {
//var a = document.getElementById(i).value;
var a=obj.value;
if (a != null) {
num += a;
}
}
}
}


function SetOp(obj) {
m = parseInt(num);
num = "";
select = obj;
}
function sub() {
n = parseInt(num);
sum = add(m, n, select);

//清空num,以免之前存的數據會有影響
num="";
/*  document.write(m);
document.write(n);
document.write(select); */

//將算出來的結果顯示在第一個輸入框裏面
result.value = sum;
/*  document.write(sum); */
/* return sum; */
}
function add(i, j, k) {
switch (k) {
case "+":
return (i + j);
case "-":
return (i - j);
case "*":
return (i * j);
case "/":
return (i / j);
}
}




發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章