一、撰寫一篇部落格要求講述四則運算2的設計思想，源程式程式碼、執行結果截圖、程式設計總結分析，並按照PSP0級的要求記錄開發過程中的時間記錄日誌。
1、設計思想：
①建立test.jsp建立第一個前端介面，提示使用者輸入要生成的題目數。使用者輸入數值後，點選提交跳轉到testmain.jsp介面，顯示生成的題目以及用來輸入的文字框，在每道題目輸入完答案之後，點選提交跳轉到testscore.jsp介面即評分介面，顯示正確和錯誤並統計正確和錯誤的數量，錯誤的題目用紅字提示正確答案。
②shizi.java中的shizi類用來生成表示式，number1和number2確定範圍1~100之間，運算子0~3隨機數對應運算子，在答案result小於零或者除法不能被整除時就重新生成。
③biaodashizu.java用來實現一些關於資料庫的增刪改查等操作，delete()用來每次生成題目前清空資料庫表，create()用來生成，xieru()用來將使用者的答案輸入資料庫表中，panduan()用來對資料庫裡的result和answer兩個屬性進行判斷，一樣則為回答正確，該題目的正確性錄入為1，錯誤的話，題目的正確性錄入為2.
④GNUtil.java是連線資料庫的工具類。
⑤建立資料庫表來儲存資訊，id代表題號，number1和number2用來存兩個數，yunsuanfu用來儲存運算子號，result用來儲存該表示式的正確答案，answer用來儲存使用者輸入的答案，zhengwu用來存int型別的1或者2，表示題目正確與否。
⑥在輸入要生成的題目後，生成相應數目的表示式，先將資料庫清空，再將這些式子的每個屬性分別輸入進資料庫，儲存下來。再在testmain.jsp中讀取並顯示出來，使用者填寫後進行儲存和比對，將評分結果顯示在testscore.jsp頁面上。
⑦在input標籤中新增required屬性用來放置部分文字框不填寫內容，使用js插入頁面倒數計時功能，時間一到自動跳轉。
2、源程式程式碼：
test.jsp
<%@page import="com.gb.yunsuan.biaodashizu" %> <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>題目</title> </head> <body background="../picture/background.png" style="background-repeat:no-repeat; background-size:100% 100%; background-attachment:fixed;"> <h2 style="color:blue" align="center">四則運算練習題</h2> <hr size=%40 color=blue> <form method="get" action="testmain.jsp"> <table align="center" border="2" width="400" style="background:white"> <tr> <td>要生成的題目數：</td> <td> <input type="text" name="num" required /> </td> </tr> <tr align="center"> <td colspan="2"> <input type="submit" name="提交" /> </td> </tr> </table> </form> </body> </html>
testmain.jsp
<%@page import="com.gb.yunsuan.biaodashizu" %> <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>答題介面</title> </head> <body background="../picture/background.png" style="background-repeat:no-repeat; background-size:100% 100%; background-attachment:fixed;"> <h2 style="color:blue" align="center">四則運算練習題</h2> <hr> <p align="center" style="color:white"> 剩餘時間為： <u><b id="time">30</b>秒</u> <b><u><a style="color:white" href="javascript:goBack();">返回</a></u></b> </p> <br> <script type="text/javascript"> var sec=document.getElementById("time"); var i=30; var timer=setInterval( function() { i--; sec.innerHTML=i; if(i==1) { window.location.href="test.jsp"; } },1000); function goBack() { window.history.go(-1); } </script> <% biaodashizu biaodashi=new biaodashizu(); if(request.getParameter("num")!=null&&!"".equals(request.getParameter("num").trim())) { biaodashi.delete(); int x=Integer.parseInt(request.getParameter("num")); biaodashi.create(x); } %> <form method="get" action="testscore.jsp"> <table align="center" border="2" width="500" style="background:white"> <tr align="center"> <td> 題目總數為： </td> <td colspan="3"> <input type="text" style="width:375px" name="num" value=<%=biaodashi.getSum()%> disabled /> </td> </tr> <tr> <td>題目編號</td> <td>題目表示式</td> <td>答案輸入</td> <td>答題情況</td> <tr> <% int x=biaodashi.getSum(); for(int i=0;i<x;i++) { %> <tr> <td><%=i+1 %></td> <td><%="\t"+biaodashi.showDan(i).getNumber1()+"\t"+biaodashi.showDan(i).getCh()+"\t"+biaodashi.showDan(i).getNumber2()+"\t"+"=" %></td> <td> <input type="text" name="text" required /> </td> <td> </td> </tr> <% } %> <tr align="center"> <td colspan="4"> <input type="submit" name="提交" /> </td> </tr> </table> </form> </body> </html>
testscore.jsp
<%@page import="com.gb.yunsuan.biaodashizu" %> <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>評分介面</title> </head> <body background="../picture/background.png" style="background-repeat:no-repeat; background-size:100% 100%; background-attachment:fixed;"> <h2 style="color:blue" align="center">四則運算練習題</h2> <hr> <% biaodashizu biaodashi=new biaodashizu(); String jieshou[]=request.getParameterValues("text"); int TRUE=0,FALSE=0; for(int i=0;i<biaodashi.getSum();i++) { int res=Integer.parseInt(jieshou[i]); biaodashi.xieru(i+1,res); biaodashi.panduan(i+1,res); } %> <form method="get" action="testmain.jsp"> <table align="center" border="2" width="500" style="background:white"> <tr> <td>題目編號</td> <td>題目表示式</td> <td>提交答案</td> <td>答題情況</td> <tr> <% for(int i=0;i<biaodashi.getSum();i++) { %> <tr> <td><%=i+1 %></td> <td><%="\t"+biaodashi.showDan(i).getNumber1()+"\t"+biaodashi.showDan(i).getCh()+"\t"+biaodashi.showDan(i).getNumber2()+"\t"+"=" %></td> <td> <%="\t"+biaodashi.showscore(i).getAnswer() %> </td> <td> <% if(biaodashi.showscore(i).getStatus()==1) { %> <img src="../picture/正確.png"> <%TRUE++; %> <% } else if(biaodashi.showscore(i).getStatus()==2) { %> <img src="../picture/錯誤.gif"> <h6 style="color:red">正確答案為：<%=biaodashi.showscore(i).getResult() %></h6> <%FALSE++; %> <% } %> </td> </tr> <% } %> <tr align="center"> <td colspan="4"> <h2>正確數：<%=TRUE %><%="\t" %>錯誤數：<%=FALSE %></h2> </td> </tr> <tr align="center"> <td colspan="4"> <a href="test.jsp">重新開始練習</a> </td> </tr> </table> </form> </body> </html>
GBUtil.java
package com.gb.Util; import java.sql.Connection; import java.sql.DriverManager; import java.sql.PreparedStatement; import java.sql.ResultSet; import java.sql.SQLException; public class GBUtil { public static Connection getConnection() { try { Class.forName("com.mysql.jdbc.Driver"); } catch(ClassNotFoundException e) { e.printStackTrace(); } String url="jdbc:mysql://localhost:3306/denglu?useSSL=false"; Connection connection=null; try { connection=DriverManager.getConnection(url, "root", "242772"); } catch (SQLException e) { e.printStackTrace(); System.out.println("資料庫連線失敗！"); } return connection; } public static void close(Connection connection) { try { if(connection!=null) { connection.close(); } }catch(SQLException e) { e.printStackTrace(); } } public static void close(PreparedStatement preparedStatement) { try { if(preparedStatement!=null) { preparedStatement.close(); } }catch(SQLException e) { e.printStackTrace(); } } public static void close(ResultSet resultSet) { try { if(resultSet!=null) { resultSet.close(); } }catch(SQLException e) { e.printStackTrace(); } } }
shizi.java
package com.gb.yunsuan; import java.util.Random; public class shizi { int number1; int number2; int fu; String ch; int result=-1; int answer; int status; public int getAnswer() { return answer; } public void setAnswer(int answer) { this.answer = answer; } public int getStatus() { return status; } public void setStatus(int status) { this.status = status; } public shizi() { Random ran=new Random(); while(result<0||result>100) { number1=ran.nextInt(100)+1; number2=ran.nextInt(100)+1; fu=ran.nextInt(4); switch(fu) { case 0: ch="+"; result=number1+number2; break; case 1: ch="-"; result=number1-number2; break; case 2: ch="*"; number1=ran.nextInt(9)+1; number2=ran.nextInt(9)+1; result=number1*number2; break; case 3: ch="/"; while(number1%number2!=0) { number1=ran.nextInt(100)+1; number2=ran.nextInt(100)+1; } result=number1/number2; break; } } } public int getNumber1() { return number1; } public void setNumber1(int number1) { this.number1 = number1; } public int getNumber2() { return number2; } public void setNumber2(int number2) { this.number2 = number2; } public String getCh() { return ch; } public void setCh(String ch) { this.ch = ch; } public int getResult() { return result; } public void setResult(int result) { this.result = result; } }
biaodashizu.java
package com.gb.yunsuan; import java.sql.Connection; import java.sql.PreparedStatement; import java.sql.ResultSet; import java.sql.SQLException; import com.gb.Util.GBUtil; import com.gb.yunsuan.shizi; public class biaodashizu { public void create(int j)//生成 { Connection connection=GBUtil.getConnection(); PreparedStatement preparedStatement=null; ResultSet resultSet=null; for(int i=0;i<j;i++) { shizi s=new shizi(); String sql="insert into sizeyunsuan(id,number1,ch,number2,result) value(?,?,?,?,?)"; try { preparedStatement=connection.prepareStatement(sql); preparedStatement.setInt(1, i+1); preparedStatement.setInt(2, s.number1); preparedStatement.setString(3, s.ch); preparedStatement.setInt(4, s.number2); preparedStatement.setString(5, ""+s.result); preparedStatement.executeUpdate(); } catch (SQLException e) { e.printStackTrace(); } } GBUtil.close(connection); GBUtil.close(preparedStatement); GBUtil.close(resultSet); } public void delete()//清空 { Connection connection=GBUtil.getConnection(); String sql="delete from sizeyunsuan"; PreparedStatement preparedStatement=null; try { preparedStatement=connection.prepareStatement(sql); preparedStatement.executeUpdate(); } catch (SQLException e) { e.printStackTrace(); } finally { GBUtil.close(connection); GBUtil.close(preparedStatement); } } public shizi showDan(int i)//返回單個 { Connection connection=GBUtil.getConnection(); PreparedStatement preparedStatement=null; ResultSet resultSet=null; String sql="select * from sizeyunsuan where id=?"; shizi shi=null; try { preparedStatement=connection.prepareStatement(sql); preparedStatement.setInt(1, i+1); resultSet=preparedStatement.executeQuery(); while(resultSet.next()) { shi=new shizi(); shi.setNumber1(resultSet.getInt("number1")); shi.setCh(resultSet.getString("ch")); shi.setNumber2(resultSet.getInt("number2")); shi.setResult(resultSet.getInt("result")); } } catch (SQLException e) { e.printStackTrace(); } GBUtil.close(connection); GBUtil.close(preparedStatement); GBUtil.close(resultSet); return shi; } public shizi showscore(int i)//返回評分介面的 { Connection connection=GBUtil.getConnection(); PreparedStatement preparedStatement=null; ResultSet resultSet=null; String sql="select * from sizeyunsuan where id=?"; shizi shi=null; try { preparedStatement=connection.prepareStatement(sql); preparedStatement.setInt(1, i+1); resultSet=preparedStatement.executeQuery(); while(resultSet.next()) { shi=new shizi(); shi.setNumber1(resultSet.getInt("number1")); shi.setCh(resultSet.getString("ch")); shi.setNumber2(resultSet.getInt("number2")); shi.setResult(resultSet.getInt("result")); shi.setAnswer(resultSet.getInt("answer")); shi.setStatus(resultSet.getInt("zhengwu")); } } catch (SQLException e) { e.printStackTrace(); } GBUtil.close(connection); GBUtil.close(preparedStatement); GBUtil.close(resultSet); return shi; } public int getSum() { int n=0; Connection connection=GBUtil.getConnection(); String sql="select id from sizeyunsuan"; PreparedStatement preparedStatement=null; ResultSet resultSet=null; try { preparedStatement=connection.prepareStatement(sql); resultSet=preparedStatement.executeQuery(); while(resultSet.next()) { n++; } } catch (SQLException e) { e.printStackTrace(); } return n; } public void xieru(int j,int result)//將使用者答案寫入資料庫 { Connection connection=GBUtil.getConnection(); PreparedStatement preparedStatement=null; String sql="update sizeyunsuan set answer = ? where id = ?"; try { preparedStatement=connection.prepareStatement(sql); preparedStatement.setInt(1, result); preparedStatement.setInt(2, j); preparedStatement.executeUpdate(); } catch (SQLException e) { e.printStackTrace(); } finally { GBUtil.close(connection); GBUtil.close(preparedStatement); } } public void panduan(int j,int result)//判斷正誤 { Connection connection=GBUtil.getConnection(); PreparedStatement preparedStatement=null; ResultSet resultSet=null; String sql="select * from sizeyunsuan where id=?"; shizi shi=null; try { preparedStatement=connection.prepareStatement(sql); preparedStatement.setInt(1, j); resultSet=preparedStatement.executeQuery(); while(resultSet.next()) { shi=new shizi(); shi.setNumber1(resultSet.getInt("number1")); shi.setCh(resultSet.getString("ch")); shi.setNumber2(resultSet.getInt("number2")); shi.setResult(resultSet.getInt("result")); shi.setAnswer(resultSet.getInt("answer")); shi.setStatus(0); } } catch (SQLException e) { e.printStackTrace(); } if(shi.getResult()!=result) { shi.setStatus(2); } else { shi.setStatus(1); } sql="update sizeyunsuan set zhengwu = ? where id = ?"; try { preparedStatement=connection.prepareStatement(sql); preparedStatement.setInt(1, shi.getStatus()); preparedStatement.setInt(2, j); preparedStatement.executeUpdate(); } catch(SQLException e) { e.printStackTrace(); } GBUtil.close(connection); GBUtil.close(preparedStatement); GBUtil.close(resultSet); } }
3、執行結果截圖：
初始介面，用來設定數目：
答題介面：
評分介面：
程式設計總結分析：
這個題目在加入資料庫的運用後，就變得條理清晰了，通過工具類連線使用資料庫，通過例項化物件呼叫函式對資料庫中資料進行操作。jsp的一些前端佈置也很重要，一些常用的功能需要使用js來實現。這個題針對二年級小學生，所以那遊戲海報來作為背景圖，更能吸引使用者。
時間記錄日誌：
學生：郭斌
日期：2017/12/7
教員：王建民
課程：軟體單元測試與程式碼規範
個人收穫：
在這個四則運算的個人專案中，我學會了佈局規劃，充分利用好資料庫，這樣會很方便，除此之外，學會了用js完成倒數計時頁面跳轉，收穫還算可以。對於必填項的設定，使用input標籤中的required屬性即可。