码迷,mamicode.com
首页 > Web开发 > 详细

用js 写计算器

时间:2014-06-21 19:34:01      阅读:438      评论:0      收藏:0      [点我收藏+]

标签:js   计算器   代码   

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"   http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html>

<head>

<meta http-equiv = "content-type" content="text/html;charset=utf-8"/>

<script src="js.js" type="text/javascript" language="javascript">

</script>

</head>

<body>

<form>

<input type="button" value="1" onclick = "cal(this.value);"/> <!--调用函数-->

<input type="button" value="2" onclick = "cal(this.value);"/>

<input type="button" value="3" onclick = "cal(this.value);"/>

<input type="button" value="4" onclick = "cal(this.value);"/>

<input type="button" value="+" onclick = "cal(this.value);"/>

<input type="button" value="-" onclick = "cal(this.value);"/>

<input type="button" value="*" onclick = "cal(this.value);"/>

<input type="button" value="/" onclick = "cal(this.value);"/>

<input type="button" value="=" onclick = "cal(this.value);"/><br />

<input type = "text" id = "text" name = "text" />

</form>

</body>

</html>

///js.js

function cal(value){
	var text = document.getElementById("text").value;	
	var last = text.charAt(text.length-1);// 获得文本框中的最后一个元素  	
	if(text == null){
		text = "";
    }else{
		if((value == "+")||(value == "-")||(value == "*")||(value == "/")){//输入的是 + - / *
			if((last == "+")||(last == "-")||(last == "*")||(last == "/")){//文本框中的最后一个元素是 + - * / 在输入 + - / * 时提示出错
				alert("输入不正确");
			}else{//文本框中的最后一个元素是 + - * / 再输入数字时会添加到后面
				text += value;
			}
		}else if(value == "="){//输入的是= 
			  if((last == "+")||(last == "-")||(last == "*")||(last == "/")){	//输入的是=  , 当最后一个元素是+ - * / 时, 不能计算 ,只显示除最后符号号的数			
				text = text.substring(0,text.length-1);				
			  }else{//输入的是=   最后一个是数字  可以计算
				text = eval(text);  ///使用eval(str) 计算
			  }			
		}else{//输入的是数字  直接显示
			text += value;
		}
	}
	document.getElementById("text").value = text; //将最后结果返回给文本框
}


用js 写计算器,布布扣,bubuko.com

用js 写计算器

标签:js   计算器   代码   

原文地址:http://nobelking.blog.51cto.com/7607139/1429108

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!