javaweb作业制作⽹页版简易计算器（3种⽅式）
我写的这三种计算器第⼀种是使⽤的javascript的⽅法将加减乘除做成四个按钮，每个按钮都有⼀个onclick，调⽤javascript的⼀个⽅法，最后将值设置到结果框⾥就⾏了。第⼆种是利⽤表单提交和转发的⽅式做的，分别写⼀个jsp页⾯上⾯写表单，然后再写⼀个servlet⽂件获取表单⾥的属性的值然后进⾏判断和运算，最后将结果转发到jsp页⾯，jsp页⾯接收转发的值并将其设置到结果。第三种是是利⽤javaBean，jsp页⾯内容与第⼆种⽅法基本相同，只是在最后不是利⽤转发，⽽是利⽤javaBean获得属性与⽅法，然后打印结果。初学javaweb，程序还不完善，望⼤家多多指点。
第⼀种⽤javascript⽅法编写的计算器，代码如下：
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = ContextPath();
String basePath = Scheme()+"://"+ServerName()+":"+ServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>My JSP 'MyCompute.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
</head>
<style type="text/css">
div{
width:215px;
height:290px;
border:2px solid black;
background-image:url(c1.jpg);
}
#aniu{
width:35px;
height:25px;
}
</style>
<body>
<div align="center">
<h1>My Computer</h1>
<font size="4" >请输⼊第⼀个数：</font><br/>
<input type="text" id="num1" /><br/>
<font size="4" >请输⼊第⼆个数：</font><br/>
<input type="text" id="num2" /> <br/>
<font size="4" >请选择运算⽅式：</font><br/>
<table>
<tr>
<td><input type="button" value="+" id="aniu" οnclick="jia();"/></td>
<td><input type="button" value="-" id="aniu" οnclick="jian();"/></td>
<td><input type="button" value="*" id="aniu" οnclick="cheng();"/></td>
<td><input type="button" value="/" id="aniu" οnclick="chu();"/></td>
</tr>
</table>
<font size="4">计算结果为：</font><br/>
<input type="text"  id="result" /> <br/>
</div>
</div>
</body>
<script type="text/javascript">
function jia(){
var ElementById("num1");
var ElementById("num2");
var nv1=n1.value;
var nv2=n2.value;
var rv=parseInt(nv1)+parseInt(nv2);
var result =ElementById("result");
result.value=rv;
}
function jian(){
var ElementById("num1");
var ElementById("num2");
var nv1=n1.value;
var nv2=n2.value;
var rv=parseInt(nv1)-parseInt(nv2);
var result =ElementById("result");
result.value=rv;
}
function cheng(){
var ElementById("num1");
var ElementById("num2");
var nv1=n1.value;
var nv2=n2.value;
var rv=parseInt(nv1)*parseInt(nv2);
var result =ElementById("result");
result.value=rv;
}
function chu(){
var ElementById("num1");
var ElementById("num2");
var nv1=n1.value;
var nv2=n2.value;
var rv=parseInt(nv1)/parseInt(nv2);
var result =ElementById("result");
result.value=rv;
}
</script>
</html>
第⼆种⽅法⽤表单提交运算⽤转发的⽅式获得结果，代码如下：jsp代码：
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = ContextPath();
String basePath = Scheme()+"://"+ServerName()+":"+ServerPort()+path+"/"; %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>My JSP 'jisuanqi.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">java修改html文件
-->
</head>
<body>
<div >
<form action="/Test/JServlet" method="post">
输⼊⼀个数：<input type="text" name="num1"/><br/>
选择运算符：<select name="flag">
<option value=1>+</option>
<option value=2>-</option>
<option value=3>*</option>
<option value=4>/</option>
</select><br>
输另⼀个数：<input type="text" name="num2"/><br/>
<input type="submit" value="提交"/><br/>
</form>
<%
Integer result=(Integer) Attribute("result");
%>
结果为：<input type="text" name="result"value="<%=result %>"/><br/>
</div>
</body>
</html>
servlet代码：
package st;
import java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
public class JServlet extends HttpServlet {
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
String num1 = Parameter("num1");
String num2 = Parameter("num2");
String f = Parameter("flag");
int flag=Integer.parseInt(f);
int n1=Integer.parseInt(num1);
int n2=Integer.parseInt(num2);
int result=0;
switch (flag) {
case 1:result=n1+n2; break;
case 2:result=n1-n2; break;
case 3:result=n1*n2; break;
case 4:result=n1/n2; break;
default:
break;
}
request.setAttribute("result",result);
}
第三种利⽤javaBean写的，代码如下：
jsp：
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = ContextPath();
String basePath = Scheme()+"://"+ServerName()+":"+ServerPort()+path+"/"; %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>My JSP 'JBC.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
</head>
<body>
<div align="center">
<form action="st/JBC.jsp" method="post">
输⼊第⼀个数：<br/>
<input type="text" name="num1" size="15"/><br/>
请选择运算符：<br/>
<input type="radio" name="flag" value="1" /><font size="5"><b>+</b></font>
<input type="radio" name="flag" value="2" /><font size="5"><b>-</b></font>
<input type="radio" name="flag" value="3" /><font size="5"><b>*</b></font>
<input type="radio" name="flag" value="4" /><font size="5"><b>/</b></font>
<br/>
输⼊第⼆个数：<br/>
<input type="text" name="num2"size="15"/><br/>
<input type="submit" value="计算"/><br/>
</form>
<jsp:useBean id="coc" class="stpute" scope="page"/>
<jsp:setProperty property="*" name="coc"/>
<%
int result=cocupter();
%>
输出的结果为：<%=result %><br/>
</div>
</body>
</html>
java⽂件代码：

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。