js 计算器

最新推荐文章于 2024-01-23 16:40:43 发布
原创最新推荐文章于 2024-01-23 16:40:43 发布 · 233 阅读
CC 4.0 BY-SA版权
<!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>