用純JQuery的方式實現一個計算器
</script>
<script type="text/javascript">
var str="";
$(function(){
$(":button").click(function(){
var num=$(this).text();
if(num=="C"){
str="";
$("#in").val(0);
}else if(num=="="){
/*eval函數是計算字符串的數字
例如字符串是:"2+3";
那麼eval函數計算的就是字符串:"2+3";
得出結果5;
可以簡單的理解爲將字符串內的內容當數學公式計算了.
* */
var result=eval(str);
$("#in").val(result);
//這裏爲了計算連加連減,所以需要將值再次返回給str;
str=result;
}//else內爲計算連加連減
else{
str+=num;
$("#in").val(str);
}
});
});
</script>
</head>
<body>
<!--
實現計算器的基本按鈕,可以在用一個大的div套4個小的div.每個小的div都有四個按鈕.
-->
<div id="box" style="width: 200px; height: 200px; background-color: gainsboro;">
<div id="">
<input type="text" name="" id="in" value="" />
<div id="">
<button>7</button>
<button>8</button>
<button>9</button>
<button>+</button>
</div>
<div id="">
<button>4</button>
<button>5</button>
<button>6</button>
<button>-</button>
</div>
<div id="">
<button>1</button>
<button>2</button>
<button>3</button>
<button>*</button>
</div>
<div id="">
<button>0</button>
<button>C</button>
<button>/</button>
<button>=</button>
</div>
</div>
</div>
</body>