首先,我说一下我的计算器的原理:
计算器原理:
第一步,定义一个变量R初始化为0,用于存储数字,当输入一位数字时,R的值为R乘以10+数字;
第二步,定义一个变量RE初始化为0,定义一个变量S用于存储运算符,当输入运算符时,把R的值赋值给RE,R的值变为0;
第三步,输入第二个数字,当点击等号时,执行运算。
其次,我说明一下,我用到的插件:
<link rel="stylesheet" href="./css/weui.min.css">
<link rel="stylesheet" href="./css/jquery-weui.css">
<link rel="stylesheet" href="./css/app.css">
<script type="text/javascript" src="jquery-3.3.1.js"></script>
直接上代码
<div class="button_sp_area">
<br>
<div class="demos-title">算术计算器</div>
<div class="weui-cells">
<div class="weui-cell">
<div class="weui-cell__bd">
<input id="txt" value="0" class="weui-input" type="text" style="text-align:right;"placeholder="请输入文本">
</div>
</div>
</div>
<br>
<table style="width: 60%;margin:auto">
<tr>
<td><input class="det1 weui-btn weui-btn_plain-default" type="button" value="←" /></td>
<td><input class="RTzero weui-btn weui-btn_plain-default" type="button" value="CE" /></td>
<td><input class="RTzero weui-btn weui-btn_plain-default" type="button" value="C" /></td>
<td><input class="PN weui-btn weui-btn_plain-primary" type="button" value="±"/></td>
<td><input class="symbol weui-btn weui-btn_plain-primary" type="button" value="√"/></td>
</tr>
<tr>
<td><input class="num weui-btn weui-btn_plain-default" type="button" value="1" /></td>
<td><input class="num weui-btn weui-btn_plain-default" type="button" value="2" /></td>
<td><input class="num weui-btn weui-btn_plain-default" type="button" value="3" /></td>
<td><input class="symbol weui-btn weui-btn_plain-primary" type="button" value="+"/></td>
<td><input class="symbol weui-btn weui-btn_plain-primary" type="button" value="%"/></td>
</tr>
<tr>
<td><input class="num weui-btn weui-btn_plain-default" type="button" value="4" /></td>
<td><input class="num weui-btn weui-btn_plain-default" type="button" value="5" /></td>
<td><input class="num weui-btn weui-btn_plain-default" type="button" value="6" /></td>
<td><input class="symbol weui-btn weui-btn_plain-primary" type="button" value="-"/></td>
<td><input class="symbol weui-btn weui-btn_plain-primary" type="button" value="^"/></td>
</tr>
<tr>
<td><input class="num weui-btn weui-btn_plain-default" type="button" value="7" /></td>
<td><input class="num weui-btn weui-btn_plain-default" type="button" value="8" /></td>
<td><input class="num weui-btn weui-btn_plain-default" type="button" value="9" /></td>
<td><input class="symbol weui-btn weui-btn_plain-primary" type="button" value="*" /></td>
<td><input class="symbol weui-btn weui-btn_plain-primary" type="button" value="/" /></td>
</tr>
<tr>
<td colspan="2"><input class="num weui-btn weui-btn_plain-default" type="button" value="0" /></td>
<td><input class="point weui-btn weui-btn_plain-primary" type="button" value="." /></td>
<td colspan="2" ><input class="results weui-btn weui-btn_plain-primary" type="button" value="=" /></td>
</tr>
</table>
<br>
<br>
<div id="footer" class="weui-cells__tips" >版权所有@copy2018</div></div>
<script type="text/javascript">
var num1=0;//用于存储第一个数
var num2=0;//用于存储第二个数
var symbol = null;//用于存储运算符
var point = null;
var i=0;
$(function(){
$("input.num").click(function() {
if(point!= null)
{ i=1;
num1=Number($(this).attr("value"))*Math.pow(0.1,i)+num1;
i++;}//浮点型算法
else
num1 =num1*10+Number($(this).attr("value"));// $(this)表示获取当前被点击元素的name值
$("#txt").attr("value",num2+symbol+num1);
});
$("input.PN").click(function() {
if(num1>=0)
num1=-num1;
else
num1= +num1;
$("#txt").attr("value",num2+symbol+num1);
});
$("input.det1").click(function() {
if(point!= null)
{ num1=(num1*Math.pow(10,i)-num1*Math.pow(10,i)%10)*Math.pow(0.1,i-1)/10;
i--;}
else
num1=(num1-num1%10)/10;
$("#txt").attr("value",num2+symbol+num1);
});
$("input.point").click(function() {
point = $(this).attr("value");
$("#txt").attr("value",num2+symbol+num1+$(this).attr("value"));
});
$("input.symbol").click(function() {
symbol = $(this).attr("value");
num2 = num1;// $(this)表示获取当前被点击元素的name值
num1 = 0;
point = null;
$("#txt").attr("value",num2+$(this).attr("value"));
});
$("input.RTzero").click(function() {
num2 = 0;
num1 = 0;
point = null;
symbol = null;//用于存储运算符
i=0;
$("#txt").attr("value",num2+num1);
});
$("input.results").click(function() {
if(symbol == "√") num1 = Math.pow(num1,1/num2);
if(symbol == "^") num1 = Math.pow(num1,num2);
if(symbol == "%") num1 = num2%num1;
if(symbol == "+") num1 = num2+num1;
if(symbol == "-") num1 = num2-num1;
if(symbol == "*" ) num1 = num2*num1;
if(symbol == "/" ) num1 = num2/num1;
$("#txt").attr("value",num1);
});
})
</script>
第一次写欢迎指正。