1. 程式人生 > >一個簡單的JSP+JavaBean web計算器

一個簡單的JSP+JavaBean web計算器

JavaBean在Java Web開發中主要用來處理業務邏輯,JSP中的複雜資料操作通常會交給JavaBean來操作,JSP只從JavaBean中取出最終結果顯示到客戶端。這樣可以很大程度上減輕JSP中大量使用Java指令碼的負擔。

我們看一個網頁版計算器的例子,我們先寫一個可以執行加減乘除運算的javaBean:

Calculator.java

package bean;

public class Calculator {
    private String firOpd;
    private String sndOpd;
    private double result;
    private
String operator; public void setFirOpd(String firOpd) { this.firOpd = firOpd; } public String getFirOpd() { return firOpd; } public void setSndOpd(String sndOpd) { this.sndOpd = sndOpd; } public String getSndOpd() { return sndOpd; } public
void setOperator(String operator) { this.operator = operator; } public String getOperator() { return operator; } public double getResult() { return result; } public void calculate() { double fir = Double.parseDouble(firOpd); double snd = Double.parseDouble(sndOpd); try
{ if(operator.equals("+")) result = fir + snd; else if(operator.equals("-")) result = fir - snd; else if(operator.equals("*")) result = fir * snd; else if(operator.equals("/")) result = fir / snd; }catch (ArithmeticException ae) { ae.printStackTrace(); } } }

接下來我們寫一個jsp頁面來呼叫這個javaBean:
cal.jsp

<%@ page contentType="text/html;charset=UTF-8" language="java" %>

<jsp:useBean id="cal" scope="request" class="bean.Calculator">
<jsp:setProperty name="cal" property="*"/>
</jsp:useBean>

<html>
  <head>
    <title>Web Calculator</title>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
  </head>

  <body>
    <%
      String CalRst = null;
      try {
          cal.calculate();
          CalRst = cal.getFirOpd() + cal.getOperator() + cal.getSndOpd() + "=" + cal.getResult();
      }catch (Exception e) {
          CalRst = e.getMessage();
      }
    %>

    <!--建立輸入表單,提交給cal.jsp處理-->
    <form method=get action="cal.jsp">
    <table>
      <tr>
        <td>簡單計算器</td>
      </tr>
      <tr>
        <td>Result : </td>
        <td><input type="text" name="result" value=<%=CalRst%> /></td>
      </tr>
      <tr>
        <td>FstOpd : </td>
        <td><input type="text" name="firOpd" /></td>
      </tr>
      <tr>
        <td>Operator : </td>
        <td><select name="operator">
              <option value="+">+</option>
              <option value="-">-</option>
              <option value="*">*</option>
              <option value="/">/</option>
            </select>
        </td>
      </tr>
      <tr>
        <td>SndOpd : </td>
        <td><input type="text" name="sndOpd" /></td>
      </tr>
      <tr>
        <td colspan="2" bgcolor="#eeeeee"><input type=submit value=Calculate /></td>
      </tr>
    </table>
    </form>
  </body>
</html>

我們先來看下cal.jsp這段程式碼,這裡順便補充說明JSP基本語法(三)中剩餘的三個動作指令。

3行,JSP動作標籤,格式為:

<jsp:useBean id="" scope="" class="" />

這個標籤的用途為建立一個javaBean的例項並指定該例項的名稱。建立該例項的類由class指定,該JavaBean的作用範圍由scope指定,例項名由id指定。

在本例中,建立一個Calculator類例項,該例項名為”cal”,作用域為”request”,表明該JavaBean只能用於當前的使用者請求中。

4行,JSP動作標籤。格式為:

<jsp:setProperty name="" property="" value="" />
<jsp:setProperty name="" property="*" />

作用是給cal的屬性賦值。如果property的值為*,表示用頁面輸入框內的值,給cal所有對應的屬性賦值。本例中,4個輸入框的name分別為result,firOpd,operator,sndOpd依次對應Calculator類中的4個同名變數。要注意,輸入框的name和javaBean中的屬性名要嚴格對應!如果property的值不為*,則要同時指明要賦的cal中的變數名和所要賦的值。如<jsp:setProperty name="cal" property="firOpd" value="10" />

14~22行為嵌入的java程式碼,呼叫cal的例項方法calculate()根據運算元和運算子計算出結果,見Calculator.java的37~53行。

24~56行建立一個輸入表單,提交給cal.jsp處理。

執行方法:

  • 在Tomcat目錄下的webapps目錄下建立一個新的資料夾”Calculator”。
  • 在Calculator目錄內建立cal.jsp,程式碼見上文。
  • 在Calculator目錄下建立WEB-INF資料夾。
  • 進入WEB-INF資料夾建立classes資料夾。
  • 進入classes資料夾建立bean資料夾。
  • 進入bean資料夾,放入Calculator.java編譯好的Calculator.class檔案。
  • 啟動Tomcat,在瀏覽器中輸入localhost:8080/Calculator/cal.jsp即可。

進入頁面如下:

    calculator

輸入第一個和第二個運算元,選擇任意操作符點選Calculate

    calculator1

得到以下結果:

    calculator2

該程式除錯沒有問題,有問題可留言我。