js代码实现计算器

来源：动视网责编：小采时间：2020-11-27 19:52:45

js代码实现计算器

js代码实现计算器:这篇文章介绍的内容是关于js代码实现计算器，有着一定的参考价值，现在分享给大家，有需要的朋友可以参考一下<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title><

推荐度：

点击下载本文 文档为doc格式

导读js代码实现计算器:这篇文章介绍的内容是关于js代码实现计算器，有着一定的参考价值，现在分享给大家，有需要的朋友可以参考一下<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title><

这篇文章介绍的内容是关于js代码实现计算器，有着一定的参考价值，现在分享给大家，有需要的朋友可以参考一下

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="utf-8"> 
<title></title> 
<script> 
 
function myjs(){ 
 
 var ft = document.getElementById("fhv").value; 
 var v1 = document.getElementById("v1").value; 
 var v2 = document.getElementById("v2").value; 
 var v3 = ''; 
 //alert(ft); 
 //alert(v1); 
 //alert(v2); 
 //alert(v3); 
 if("+" == ft){ 
 v3 = Number(v1) +Number(v2); 
 }else if("-" == ft){ 
 v3 = Number(v1)-Number(v2); 
 }else if("*" == ft){ 
 v3 = Number(v1)*Number(v2); 
 }else if("/" == ft){ 
 v3 = Number(v1)/Number(v2); 
 }else{ 
 v3 = ''; 
 } 
 //alert(v3); 
 document.getElementById("v3").value= v3; 
 document.getElementById("z3").innerHTML = v3; 
 
} 
function changeFh(){ 
 var fu = document.getElementById("fh"); 
 var idx= fu.selectedIndex ; 
 var ft = fu.options[idx].value; 
 var fs = fu.options[idx].text; 
 //alert(ft == "+"); 
 if("+" == ft){ 
 document.getElementById("an").innerHTML= '加'; 
 document.getElementById("fhv").value= '+'; 
 }else if("-" == ft){ 
 document.getElementById("an").innerHTML= '减'; 
 document.getElementById("fhv").value= '-'; 
 }else if("*" == ft){ 
 document.getElementById("an").innerHTML= '乘'; 
 document.getElementById("fhv").value= '*'; 
 }else if("/" == ft){ 
 document.getElementById("an").innerHTML= '除'; 
 document.getElementById("fhv").value= '/'; 
 }else{ 
 document.getElementById("an").innerHTML= '请选择符号'; 
 document.getElementById("fhv").value= ''; 
 } 
 var v1 = document.getElementById("v1").value; 
 v1 = v1.replace(/\s+/g,""); 
 
 if(v1.length == 0){ 
 document.getElementById("fhz").innerHTML = ''; 
 } 
 
 } 
 function radow_load(){ 
 changeFh(); 
 } 
 function checkValue1(){ 
 var v1 = document.getElementById("v1").value; 
 v1 = v1.replace(/\s+/g,""); 
 //alert(isNaN(v1)); 
 if(isNaN(v1)){ 
 document.getElementById("v1").value = "" ; 
 alert("请输入数字!"); 
 } 
 document.getElementById("z1").innerHTML = v1; 
 } 
 function checkValue2(){ 
 var v2 = document.getElementById("v2").value; 
 v2 = v2.replace(/\s+/g,""); 
 if(isNaN(v2)){ 
 document.getElementById("v2").value = ''; 
 alert("请输入数字"); 
 } 
 var fhx = document.getElementById("fhv").value; 
 if(fhx.length == 0){ 
 document.getElementById("v2").value = ''; 
 alert("请输入符号"); 
 return; 
 } 
 document.getElementById("fhz").innerHTML = fhx; 
 document.getElementById("z2").innerHTML = v2; 
 document.getElementById("fhzy").innerHTML = '='; 
 } 
 function clearValue(){ 
 //alert("clear"); 
 document.getElementById("v1").value= ''; 
 document.getElementById("v2").value= ''; 
 document.getElementById("v3").value= ''; 
 document.getElementById("fhv").value= ''; 
 document.getElementById("fh").value= ''; 
 document.getElementById("fhz").value= ''; 
 document.getElementById("an").innerHTML= '请选择符号'; 
 document.getElementById("z1").innerHTML= ''; 
 document.getElementById("z2").innerHTML= ''; 
 document.getElementById("z3").innerHTML= ''; 
 document.getElementById("fhzy").innerHTML= ''; 
 document.getElementById("fhz").innerHTML= ''; 
 
 } 
</script> 
</head> 
<body onload="radow_load()"> 
 
<h1>我的 Web 页面</h1> 
<table> 
<tr> 
<td> 
<input id="v1" name="第一个值" onchange="checkValue1()"/> 
<select id="fh" name="符号" onchange="changeFh()" > 
 <option value ="+">+</option> 
 <option value ="-">-</option> 
 <option value="*">*</option> 
 <option value="/">/</option> 
</select> 
<input id="v2" name="第二个值" onchange="checkValue2()"/> 
<b>=</b> 
<input id="v3" name="结果"/> 
 <button id="an" type="button" onclick="myjs()">请选择符号</button> 
 <button id="ca" type="button" onclick="clearValue()">清空</button> 
<input id="fhv" name="fhv" hidden="true"/> 
</td> 
</tr> 
<tr> 
<td> 
<b id="z1"></b> 
<b id="fhz"></b> 
<b id="z2"></b> 
<b id="fhzy"></b> 
<b id="z3"></b> 
</td> 
 
</tr> 
 
</table> 
</body> 
</html>

js代码实现计算器

推荐度：

点击下载本文 文档为doc格式

标签：计算机计算器实现

热门焦点

js代码实现计算器

js代码实现计算器

js代码实现计算器

最新推荐

猜你喜欢

热门推荐