制作简单计算器——想要成为合格的java工程师，就别犯懒！
制作简单计算器——想要成为合格的java工程师，就别犯懒！
用到的技术：HTML + JavaScript;主要以javascript为主。
制作简单计算器——想要成为合格的java工程师，就别犯懒！
实现简单的加减法计算；
操作步骤：
-
首先制作一个html页面；代码如下
<!DOCTYPE html>
<html>
<head>
<metacharset="UTF-8">
<title>计算器</title>
</head>
<body>
<divid="keys" onclick="fun()">
<button>1</button>
<button>2</button>
<button>3</button>
<button>4</button>
<button>5</button><br>
<button>6</button>
<button>7</button>
<button>8</button>
<button>9</button>
<button>0</button><br>
<button>C</button>
<button>+</button>
<button>-</button>
<button>*</button>
<button>/</button>
<button>=</button> </div>
<textarea id="sc"style="resize:none;width:200px; height:50px;" readonly></textarea>
</body>
</html>
-
利用javascript实现二级菜单效果；代码如下
<script type="text/javascript">
varsc= document.getElementById("sc");
varkeys = document.getElementById("keys");
functionfun(){
var e=e||window.event;//找到button的内容
var btnTxt=e.target.innerHTML //该元素的值
if(e.target.nodeName=="BUTTON"){//判断是否是点在了button上
try{
switch(btnTxt){
case"=":
//alert("计算") ;
sc.value=eval(sc.value)
break;
case"C":
//alert("清空")
sc.value=""
break;
default:
// alert("拼字串")
sc.value+=btnTxt
}//switch end
}catch(e){//报错语
sc.value="您的输入有误"
}
}
</script>
-
知识要点剖析：如何理解var e=e||window.event的？
解答：为了实现多种浏览器兼容；
整个代码是这样的vare=event?event||window.event;
意思是：如果存在event,那么var e=event;而如果不存在event，那么var e=window.event
-
eval(String)方法：
是通过计算 string 得到的值（如果有的话）。
- 我的微信
- 这是我的微信扫一扫
-
- 我的微信公众号
- 我的微信公众号扫一扫
-
