用纯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>