利用js实现计算器（未完成）

最新推荐文章于 2021-08-05 20:59:34 发布

qq_36843099

最新推荐文章于 2021-08-05 20:59:34 发布

阅读量139

点赞数

本文链接：https://blog.csdn.net/qq_36843099/article/details/80944410

版权

接上文，直接代码：

<div class="button_sp_area">
<br>
<div class="hide demos-title">科学计算器</div>
<div class="text demos-title">普通计算器</div>
<div class="hide weui-cells">
<div class="weui-cell">
<div class="weui-cell__bd">
<input id="txt1" value="" class="weui-input" type="text" style="text-align:right;"placeholder="请输入文本">
</div>
</div>
</div>
<div class="text weui-cells">
<div class="weui-cell">
<div class="weui-cell__bd">
<input id="txt2" 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="hide extension weui-btn weui-btn_plain-default" type="button" value=" " /></td>
<td ><input class="hide symbol weui-btn weui-btn_plain-default" type="button" value="Inv" /></td>
<td ><input class="hide symbol weui-btn weui-btn_plain-default" type="button" value="in" /></td>
<td ><input class="symbol hide LParenthesis weui-btn weui-btn_plain-default" type="button" value="(" /></td>
<td ><input class="symbol hide RParenthesis weui-btn weui-btn_plain-default" type="button" value=")" /></td>
<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="hideBt weui-btn weui-btn_plain-default" type="button" value="OO" /></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="symbol hide Int weui-btn weui-btn_plain-default" type="button" value="Int" /></td>
<td ><input class="symbol hide sinh weui-btn weui-btn_plain-default" type="button" value="sinh" /></td>
<td ><input class="symbol hide sin weui-btn weui-btn_plain-default" type="button" value="sin" /></td>
<td ><input class="symol hide square weui-btn weui-btn_plain-default" type="button" value="x²" /></td>
<td ><input class="symbol hide factorial weui-btn weui-btn_plain-default" type="button" value="n!" /></td>
<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="symbol hide weui-btn weui-btn_plain-default" type="button" value="dms" /></td>
<td ><input class="symbol hide weui-btn weui-btn_plain-default" type="button" value="cosh" /></td>
<td ><input class="symbol hide weui-btn weui-btn_plain-default" type="button" value="cos" /></td>
<td ><input class="symbol hide weui-btn weui-btn_plain-default" type="button" value="x³" /></td>
<td ><input class="symbol hide weui-btn weui-btn_plain-default" type="button" value="3√x" /></td>
<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 hide PI weui-btn weui-btn_plain-default" type="button" value="π" /></td>
<td ><input class="symbol hide tanh weui-btn weui-btn_plain-default" type="button" value="tanh" /></td>
<td ><input class="symbol hide tan weui-btn weui-btn_plain-default" type="button" value="tan" /></td>
<td ><input class="symbol hide log weui-btn weui-btn_plain-default" type="button" value="log" /></td>
<td ><input class="symbol hide tenNum weui-btn weui-btn_plain-default" type="button" value="10^x" /></td>
<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="hide F-E weui-btn weui-btn_plain-default" type="button" value="F-E" /></td>
<td><input class="hide Exp weui-btn weui-btn_plain-primary" type="button" value="Exp" /></td>
<td colspan="2" ><input class="hide Mod weui-btn weui-btn_plain-primary" type="button" value="Mod" /></td>
<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;
var m=0,n=0;
var isNum=false;
var arr = new Array();
$(function(){
$(".hide").hide();
$("input.hideBt").click(function() {//隐藏和显示某个组件
if($(this).attr("value")=="OO")
{$(this).attr("value","SD");
$(".hide").show();
$(".text").hide();
return;}
if($(this).attr("value")=="SD")
{$(".hide").hide();
$(".text").show();
$(this).attr("value","OO");
return;}
});
$("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值

$("#txt2").attr("value",num2+symbol+num1);
$("#txt1").attr("value",$("#txt1").attr("value")+$(this).attr("value"));
});
$("input.PN").click(function() {
if(num1>=0)
num1=-num1;
else
num1= +num1;
$("#txt2").attr("value",num2+symbol+num1);//两个数的运算
$("#txt1").attr("value",$("#txt1").attr("value")+$(this).attr("value"));//多个数的运算
});
$("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;
$("#txt2").attr("value",num2+symbol+num1);
$("#txt1").attr("value",$("#txt1").attr("value")+$(this).attr("value"));
});
$("input.point").click(function() {
point = $(this).attr("value");
$("#txt2").attr("value",num2+symbol+num1+$(this).attr("value"));
$("#txt1").attr("value",$("#txt1").attr("value")+$(this).attr("value"));
});
$("input.symbol").click(function() {
symbol = $(this).attr("value");
num2 = num1;// $(this)表示获取当前被点击元素的name值
num1 = 0;
point = null;
$("#txt2").attr("value", num2+$(this).attr("value"));
$("#txt1").attr("value",$("#txt1").attr("value")+$(this).attr("value"));
});
$("input.RTzero").click(function() {
num2 = 0;
num1 = 0;
point = null;
symbol = null;//用于存储运算符
i=0;
$("#txt2").attr("value",num2+num1);
$("#txt1").attr("value"," ");
});
$("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;
$("#txt2").attr("value",num1);
arr=$("#txt1").attr("value");//取得字符串的值进行运算

for (var i=0;i<arr.length;i++)
{
if(!isNaN(arr[i]))
//数字
document.write("isNan" + "<br>");
else
//字符
document.write("unNan" + "<br>");
/* 我的想法，第一步，新建一个s[]栈用于存储运算符，新建一个n[]用于存储数字，新建一个r[]栈，用于存储计算结果；
第二步，开始输入表达式，首先向s存入一个=运算符，
判断第一个字符是否为数字，
如果是，存入n，记作n[0]；
如果不是数字，存入s，记作s[1]，判断s[1]和s[0]是否相等，
如果相等，运算结束，输出n[0]的值；
如果不相等，在判断s[1]是否为运算符，
如果是，那么从n栈取出栈顶元素，进行计算，写入栈顶；
如果不是，那么继续执行。
判断第二个字符是否为数字，
如果是，那么n[0]=n[0]*10+第二个字符；
如果不是数字，同第一个字符一样；
…………………一直到最后一个字符
第三步，错误判断，便利s和m如果，s不为空或m元素个数大于1那么错误； */

}
$("#txt1").attr("value",$("#txt1").attr("value")+$(this).attr("value")+num1);
});
})
</script>