生活随笔
收集整理的這篇文章主要介紹了
js计算器（正则）
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>我的計算器</title>
<style>
*{margin:0px; padding:0px;}
#jsq{
width:300px;
height:330px;
background:#CCC;
margin:0 auto;
margin-top:10%;
}
#showv{width:298px;height:50px;display:block; font-size:16px; line-height:50px;}
input{width:56px; height:56px;margin-top:10px;}
</style>
<script type="text/javascript" src="CalcEval.js"></script>
</head>
<body>
<div id="jsq">
<input type='text' id="showv"/>
<input type="button" value="7" onClick="jsq(this.value);" />
<input type="button" value="8" onClick="jsq(this.value);"/>
<input type="button" value="9" onClick="jsq(this.value);"/>
<input type="button" value="back" onClick="tuige();"/>
<input type="button" value="C" onClick="qingling();"/>
<input type="button" value="4" onClick="jsq(this.value);"/>
<input type="button" value="5" onClick="jsq(this.value);"/>
<input type="button" value="6" onClick="jsq(this.value);"/>
<input type="button" value="*" onClick="jsq(this.value);"/>
<input type="button" value="/" onClick="jsq(this.value);"/>
<input type="button" value="1" onClick="jsq(this.value);"/>
<input type="button" value="2" onClick="jsq(this.value);"/>
<input type="button" value="3" onClick="jsq(this.value);"/>
<input type="button" value="+" onClick="jsq(this.value);"/>
<input type="button" value="-" onClick="jsq(this.value);"/>
<input type="button" value="0" onClick="jsq(this.value);"/>
<input type="button" value="00" onClick="jsq(this.value);"/>
<input type="button" value="." onClick="jsq(this.value);"/>
<input type="button" value="%" onClick="jsq(this.value);"/>
<input type="button" value="=" onClick="dengyu();"/>
</div>
<script>
var cal = new CalcEval();
var showv=document.getElementById('showv');
showv.focus();
function jsq(v){
a=showv.value.substr(-1,1);
zz1=/^[0-9]$/;
//重復運算符
if(!zz1.test(a)&&!zz1.test(v)){
console.log('請輸入正確格式');
return false;
}
str=showv.value+v;
var zz2=/^[0]+/;
//多個0
if(zz2.test(str)){
str=str.replace(zz2,0);
}
//運算符之后的多個0
var zz3=/[+-*/%]{1}[0]{2}/;
if(zz3.test(str)){
str=str.substr(0,str.length-1);
}
//開始多個點0.0.0.01
var zz4=/^[0-9]+.[0-9]+.{1,}/;
if(zz4.test(str)){
str=str.substr(0,str.length-1);
}
//運算符之后多給點
var zz5=/[+-*/%][0-9]+.[0-9]+.{1,}/;
if(zz5.test(str)){
str=str.substr(0,str.length-1);
}
//開始為0
var zz6=/^[0]{1}[0-9]{1,}/;
if(zz6.test(str)){
str=str.substr(1,str.length-1);
}
//運算符之后為0開始
var zz7=/[+-*/%][0]{1}[0-9]{1,}/;
if(zz7.test(str)){
str=str.substr(0,str.length-2)+str.substr(-1,1);
}
showv.value=str;
}
function dengyu(){
var zz=/^[+-*/%.]+$/;
var a=showv.value.substr(-1,1);
if(zz.test(a)){//最后輸入的是運算符
showv.value=showv.value.substr(0,showv.value.length-1);
}
showv.value=cal.eval(showv.value);
showv.focus();
}
function qingling(){
showv.value="";
showv.focus();
}
function tuige(){
showv.value=showv.value.substr(0,showv.value.length-1);
showv.focus();
}
//鍵盤輸入 步驟同上
document.onkeyup=function key(a){
var str = showv.value;
var zz = /[^+-*/%.0-9]{1,}/;
str = str.replace(zz,"");
var zz2 = /[+-*/%.][+-*/%.]{1,}/;
var arr = str.match(zz2);
if(arr!=null){
str = str.replace(zz2,arr[0].substr(0,1));
}
var zz3 = /^[0][0]{1,}/;
str = str.replace(zz3,0);
var zz4 = /[+-*/%][0][0]{1,}/;
var arr4 = str.match(zz4);
if(arr4!=null){
str = str.replace(zz4,arr4[0].substr(0,2));
}
var zz5 = /[0-9]+.[0-9]+.{1,}/;
var arr5 = str.match(zz5);
if(arr5!=null){
str = str.replace(zz5,arr5[0].substr(0,arr5[0].length-1));
}
var zz6 = /[0][1-9]{1,}/;
var arr6 = str.match(zz6);
if(arr6!=null){
str = str.replace(zz6,arr6[0].substr(1,arr6[0].length));
}
showv.value = str;
if(a.keyCode==13){
dengyu();
}
}
</script>
</body>
</html>
總結
以上是生活随笔為你收集整理的js计算器（正则）的全部內容，希望文章能夠幫你解決所遇到的問題。
如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。
