⽤JSP+JavaBean制作简易计算器
⼀、起因
刚刚起步学习JSP,迫于需要提交作业的关系,⽤了⼀下午的时间翻阅了各种资料,硬是把作业⽣⽣地撸出来。-__-!
本程序基于JSP+JavaBean实现。
开发环境:
WIndows10 1709
TomCat version 8.5
JDK version 1.8.0_161
Google Chrome 65
Eclipse Java EE Version: Oxygen.2 Release (4.7.2)
Hbuilder 9.0.2
欢迎各位⼤佬指点修正。
这个程序并不够完善,只能实现加减乘除,还是两个数的运算。
⼆、效果图
1、初始界⾯
2、计算效果
(1)输⼊数字
(2)运算结果(输⼊框⾃动清空)
(3)被除数为0时会弹出Error界⾯
calculator.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ page errorPage="/error.jsp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "/TR/html4/loose.dtd"> <html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css" href="css/calculator.css"/>
<title>简易计算器</title>
</head>
<body>
<div id="calculator">
<h1>简易计算器</h1>
<div id="display">
<p>
<jsp:useBean id="calculatorBean" class="top.cheungchingyin.calculator.Calculator"></jsp:useBean>
<jsp:setProperty property="*" name="calculatorBean"/>
<%
calculatorBean.calculator();
%>
计算结果:
<jsp:getProperty property="firstNum" name="calculatorBean"/>
<jsp:getProperty property="operator" name="calculatorBean"/>
<jsp:getProperty property="secondNum" name="calculatorBean"/>
=
<jsp:getProperty property="result" name="calculatorBean"/>
</p>
</div>
<form action="calculator.jsp" method="post">
<table id="calArea">
<tr>
<td><div id="word">第⼀个数:</div></td>
<td><input type="text" name="firstNum" id="editText"></td>
</tr>
<tr><td> </td></tr>
<tr>
<td>
<select name="operator" id="operator">
<option value="+">+</option>
<option value="-">-</option>
<option value="*">*</option>
<option value="/">/</option>
</select>
</td>
</tr>
<tr><td> </td></tr>
<tr>
<td><div id="word">第⼆个数</div></td>
<td><input type="text" name="secondNum" id="editText" /></td>
</tr>
<tr><td> </td></tr>
<tr>
<td><input type="submit" name="put" id="buttom" value="提交"></td>
<td><input type="reset" name="clear" id="buttom" value="重置" /></td>
</tr>
</table>
</form>
</div>
</body>
</html>
calculator.css
@charset "UTF-8";
#calArea{
text-align: center;
}
#calculator{
width: 400px;
height: 600px;
background-color: #FFF;
position: absolute;
top: 20%;
left: 40%;
background: hsla(0,0%,100%,.3);
border-radius:20px ;
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.7); z-index: 100;
overflow: hidden;
box-sizing: border-box;
}
#display{
width: 400px;
height: 200px;
background-color: #CCC;
margin-bottom: 20px;
font
}
#word{
javabean是干什么的font-size: 25px;
font: "微软雅⿊";
}
#operator{
width: 100px;
height: 30px;
}
#buttom{
width: 80px;
height: 30px;
}
#editText{
width: 250px;
height: 30px;
}
h1{
text-align: center;
}
body{
background: url(../img/login-background.svg); }
p{
text-align:center;
font-size: 25px;
font: "微软雅⿊";
padding-top:90px;
}
Calculator.java
package top.cheungchingyin.calculator;
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论