您的位置:首页 > Web前端 > JavaScript

JavaScript之简易计算器的实现

2016-09-08 21:16 537 查看
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
*{
margin: 0;
padding: 0;
}
#box{
width: 600px;
height: 100px;
margin: 30px auto;
}
input{
width: 100px;
height: 30px;
}
#sel{
width: 70px;
height: 30px;

}
</style>
</head>
<body>
<div id="box">
<input type="text" id="txt">
<select name="" id="sel">
<option value="+">+</option>
<option value="-">-</option>
<option value="*">*</option>
<option value="/">/</option>
</select>
<input type="text" id="txt1">
<input type="button" value="=" id="but">
<input type="text" id="txt2">
</div>
</body>
<script>
var oBut=document.getElementById("but");
oBut.onclick=function(){
var add1=parseInt(document.getElementById("txt").value);
var add2=parseInt(document.getElementById("txt1").value);
var add3=document.getElementById("sel").value;
var add;
switch (add3){
case "+":
add=add1+add2;
break;
case "-":
add=add1-add2;
break;
case "*":
add=add1*add2;
break;
case "/":
add=add1/add2;
break;
}
document.getElementById("txt2").value=add;
}
</script>
</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  JavaScript