js实现的计算器功能

先送上前端代码


		<div class="q1">
			<div id="set"></div>
			<input type="text" id="put" />
			<div>
			<button onclick="fool(7)">7</button>
			<button onclick="fool(8)">8</button>
			<button onclick="fool(9)">9</button>
			<button onclick="suanshi('*')">*</button>
			</div>
			<div>
			<button onclick="fool(4)">4</button>
			<button onclick="fool(5)">5</button>
			<button onclick="fool(6)">6</button>
			<button onclick="suanshi('-')">-</button>
			</div>
			<div>
			<button onclick="fool(1)">1</button>
			<button onclick="fool(2)">2</button>
			<button onclick="fool(3)">3</button>
			<button onclick="suanshi('+')">+</button>
			</div>
			<div>
			<button onclick="deletee()">delete</button>
			<button onclick="fool(0)">0</button>
			<button onclick="fool('.')">.</button>
			<button onclick="suanshi('=')">=</button>
			</div>
		</div>
		

js代码:

<script>
			var sett=document.getElementById("set");
			var putt=document.getElementById("put");
			
			var result=0;//保存输入的结果
			var arr="";//判断是什么运算符
			var str="";//保存输入的数字
			function fool(value){
                   //判断小数点不能出现两次
				if(value === ".")
				{	
					if(/\.{1}/g.test(str))return;
				}
                    
				if(/^0$/.test(str)|| /^\./.test(str)){
					str = "";
				}
				
				str = value+str
				putt.value=str;
			}
			function deletee(){
				
				putt.value=putt.value.substring(0,putt.value.length-1)
			}
			function suanshi(arr){
				sett.innerText	= sett.innerText  + " " + str + " " + arr + ;
				switch (arr){
					case "+":
							result += Number(str);
							putt.value=result;
				
						break;
					case "-":
							if(result==0){
								result = Number(str);
								putt.value=result;
								break;
							}
							result = Number(result) - Number(str)  ;
							putt.value=result
						break;
					default:
						break;
				}
				
				str="";
			}
	

时间原因没有写乘法与除法

大佬误喷  纯属记录自己的经历

发布了4 篇原创文章 · 获赞 0 · 访问量 77

猜你喜欢

转载自blog.csdn.net/qq_41801219/article/details/104476030