jscode 实现简单计算器

代码

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<meta http-equiv="X-UA-Compatible" content="IE=edge">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>Document</title>

</head>

<body>

<div>

<span id="result"></span>

</div>

<table border="1px" width="200px" height="300px">

<tbody align="center">

<tr>

<td width="50px" οnclick="leftBracket()">(</td>

<td width="50px" οnclick="rightBracket()">)</td>

<td width="50px" οnclick="ppow()">^</td>

<td width="50px" οnclick="psqrt()">√</td>

</tr>

<tr>

<td οnclick="c()">C</td>

<td οnclick="po('%')">%</td>

<td width="50px" οnclick="backspace()"><img src="img/back.png" width="25px"/></td>

<td οnclick="po('÷')">÷</td>

</tr>

<tr>

<td οnclick="pn(7)">7</td>

<td οnclick="pn(8)">8</td>

<td οnclick="pn(9)">9</td>

<td οnclick="po('×')">×</td>

</tr>

<tr>

<td οnclick="pn(4)">4</td>

<td οnclick="pn(5)">5</td>

<td οnclick="pn(6)">6</td>

<td οnclick="po('-')">-</td>

</tr>

<tr>

<td οnclick="pn(1)">1</td>

<td οnclick="pn(2)">2</td>

<td οnclick="pn(3)">3</td>

<td οnclick="po('+')">+</td>

</tr>

<tr>

<td οnclick="pn('00')">00</td>

<td οnclick="pn(0)">0</td>

<td οnclick="pn('.')">.</td>

<td οnclick="equals1()">=</td>

</tr>

</tbody>

</table>

</body>

<script>

//div块元素

var result;

//是否进行了运算

var equal = false;

window.onload = function(){

result = document.getElementById("result");

result.innerHTML = "";

}

//如果进行了运算,下次输入数前进行清零

function isEqual(){

if (equal){

c();

equal = false;

}

}

function pn(n){

isEqual();

result.innerHTML += n;

}

function po(o){

result.innerHTML += o;

equal = false;

}

function leftBracket(){

isEqual();

var r = result.innerHTML;

var c = r.charAt(r.length - 1);

if ("0" <= c && c <= "9" || c == "%"){

po("×");

}

result.innerHTML += "(";

}

function rightBracket(){

isEqual();

result.innerHTML += ")"

}

function ppow(){

isEqual();

result.innerHTML += "^"

}

function psqrt(){

isEqual();

var r = result.innerHTML;

var c = r.charAt(r.length - 1);

if ("0" <= c && c <= "9" || c == "%"){

po("×");

}

result.innerHTML += "√";

}

function c(){

result.innerHTML = "";

}

function backspace(){

var r = result.innerHTML;

result.innerHTML = r.substr(0,r.length - 1);

isEqual();

}

function equals1(){

equal = true;

var r = result.innerHTML;

//将特殊字符进行替换

r = r.replace(/×/g,"*");

r = r.replace(/÷/g,"/");

r = r.replace(/%/g,"*0.01");

try{

r = pow(r);

r = sqrt(r);

result.innerHTML=eval(r);

}catch(e){

result.innerHTML="表达式不正确";

}

}

function pow(r){

var arr = r.split("^");

if (arr.length == 1){

return r;

}

var leftstr = leftOperation(arr[0]);

var rightstr = rightOperation(arr[1]);

var num = "Math.pow(" + leftstr + "," + rightstr + ")";

var leftr = arr[0].substring(0,arr[0].length - leftstr.length);

var rightr = arr[1].substring(rightstr.length,arr[1].length);

var r = leftr + num + rightr;

return pow(r);

}

function sqrt(r){

if (r.indexOf("√") == -1){

return r;

}

var arr = r.split("√");

var rightstr = rightOperation(arr[1]);

var num = "Math.sqrt(" + rightstr + ")";

var leftr = arr[0];

var rightr = arr[1].substring(rightstr.length,arr[1].length);

var r =leftr + num + rightr;

return sqrt(r);

}

function leftOperation(r){

var leftBracket = 0;

var rightBracket = 0;

var i;

for (i = r.length - 1; i >=0; i--){

var c = r.charAt(i);

if (c == ")"){

rightBracket++;

} else if (leftBracket == rightBracket && c >="0" && c <= "9"){

break;

} else if (c == "("){

leftBracket++;

}

}

return r.substring(i);

}

function rightOperation(r){

var leftBracket = 0;

var rightBracket = 0;

var i;

for (i = 0; i < r.length; i++){

var c = r.charAt(i);

if (c == "("){

leftBracket++;

} else if (leftBracket == rightBracket && c >="0" && c <= "9"){

break;

} else if (c == ")"){

rightBracket++;

}

}

return r.substring(0,i+1);

}

</script>

<style>

div {

width: 198px;

height: 50px;

border: 1px solid black;

border-bottom: none;

position: relative;

}

#result {

position: absolute;

right: 5px;

bottom: 5px;

}

</style>

</html>

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值