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 = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+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" style="width:150;"/><br/>
	 <font size="4" >請輸入第二個數：</font><br/>
	 <input type="text" id="num2" style="width:150;"/> <br/>
	 <font size="4" >請選擇運算方式：</font><br/>
	 <table>
	 <tr>
	 <td><input type="button" value="+" id="aniu" onclick="jia();"/></td>
	 <td><input type="button" value="-" id="aniu" onclick="jian();"/></td>
	 <td><input type="button" value="*" id="aniu" onclick="cheng();"/></td>
	 <td><input type="button" value="/" id="aniu" onclick="chu();"/></td>
	 </tr>
	 </table> 
	 <font size="4">計算結果爲：</font><br/>
	 <input type="text"  id="result" style="width:150;"/> <br/> 	 	  
	</div>
  </body>
  <script type="text/javascript">
  function jia(){
	  var n1=document.getElementById("num1");
	  var n2=document.getElementById("num2");
	  var nv1=n1.value;
	  var nv2=n2.value;
	  var rv=parseInt(nv1)+parseInt(nv2);
	  var result =document.getElementById("result");
	  result.value=rv;
  }
  function jian(){
	  var n1=document.getElementById("num1");
	  var n2=document.getElementById("num2");
	  var nv1=n1.value;
	  var nv2=n2.value;
	  var rv=parseInt(nv1)-parseInt(nv2);
	  var result =document.getElementById("result");
	  result.value=rv;
  }
  function cheng(){
	  var n1=document.getElementById("num1");
	  var n2=document.getElementById("num2");
	  var nv1=n1.value;
	  var nv2=n2.value;
	  var rv=parseInt(nv1)*parseInt(nv2);
	  var result =document.getElementById("result");
	  result.value=rv;
  }
  function chu(){
	  var n1=document.getElementById("num1");
	  var n2=document.getElementById("num2");
	  var nv1=n1.value;
	  var nv2=n2.value;
	  var rv=parseInt(nv1)/parseInt(nv2);
	  var result =document.getElementById("result");
	  result.value=rv;
  }
  </script>
</html>

第二種方法用表單提交運算用轉發的方式獲得結果，代碼如下：
jsp代碼：

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+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">
	-->

  </head>
  
  <body>
<div style="border:2px;">
<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) request.getAttribute("result");
%>
結果爲：<input type="text" name="result"value="<%=result %>"/><br/>
</div>
  </body>
</html>

servlet代碼：

package com.Servlet.test;
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 = request.getParameter("num1");
		String num2 = request.getParameter("num2");
		String f = request.getParameter("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);
		request.getRequestDispatcher("/com.jsp.test/jisuanqi.jsp").forward(request, response);
	}

}

第三種利用javaBean寫的，代碼如下：

jsp：

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+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"style="background-color:#CDAA7D;width:150px;">
<form action="com.jsp.test/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="com.java.test.compute" scope="page"/>
<jsp:setProperty property="*" name="coc"/>
<%
int result=coc.comupter();
%>
輸出的結果爲：<%=result %><br/>
</div>
  </body>
</html>

java文件代碼：

package com.java.test;

public class compute {
	private int num1;
	private int num2;
	private int flag;
	private int result;
	public int getNum1() {
		return num1;
	}

	public void setNum1(int num1) {
		this.num1 = num1;
	}

	public int getNum2() {
		return num2;
	}

	public void setNum2(int num2) {
		this.num2 = num2;
	}

	public int getFlag() {
		return flag;
	}

	public void setFlag(int flag) {
		this.flag = flag;
	}

	public int comupter() {
		switch (flag) {
		case 1:result=num1+num2;break; 
		case 2:result=num1-num2;break; 
		case 3:result=num1*num2;break;  
		case 4:result=num1/num2;break;  
		default:
			break;
		}
		return result; 
	}
	
}

javaweb作業製作網頁版簡易計算器（3種方式）

mysql 構建海量數據測試表

基於websocket協議的即時通訊webapp（摘自本人畢業論文）

javaweb簡單的登錄註冊功能實現

javaweb作業製作網頁版簡易計算器（3種方式）

javaweb ，jsp頁面輸出9x9乘法表

Mac下配置sublime實現LaTeX

https://yachay.unat.edu.pe/blog/index.php?comment_area=format_blog&comment_component=blog&comment_co

linux以太網驅動總結