程序设计思想：
首先，由于之前的四则运算已经基本上把需要实现的功能都实现了，所以这次任务的重心在于怎么把一个Java程序变成网页版的。
第一步我的想到需要哪几个网页，每个网页都实现什么功能。那么，主页是必不可少的，用户需要在主页上选择一些出题的基本参数，比如说自然数的范围、
除法有无余数，减法有无负数等，当用于选择好之后，由后台开始出题，于另一个页面显示后台出的题目，用户于此页面进行答题，做完之后，
提交到另一个页面，对用户输入的答案与出题同时写进数据库的答案进行比较，同时告诉用户做对的题目是哪些，做错的题目是哪些。
以上是这个在线答题系统的整体框架，接下来就是对上述描述进行实现，代码如下：
首先是主页的代码：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>index</title>
<link href="css/css01.css" rel="stylesheet" type="text/css"/>
<script language="javascript">
function istrue(form1){
text1=form1.text1.value;
text2=form1.text2.value;
if(text1.length==0)
{
alert("题目数量不能为空！");
form1.text1.focus();
return false;
}
if(text2.length==0)
{
alert("自然数范围不能为空！");
form1.text2.focus();
return false;
}
}
</script>
</head>
<body>
<h2>Online答题系统</h2>
<div id="index" >
<form action="jsp01.jsp" name="form1" id="form1" method="post" onsubmit="return istrue(form1)">
<table>
<tr>
<td>
<label for="text1">请输入题目的数量：</label></td><td>
<input type="text" name="text1" id="text1" value="10" />
</td>
</tr>
<tr>
<td>
<label for="text2">请输入自然数的范围：</label></td><td>
<input type="text" name="text2" id="text2" value="10"/>
</td>
</tr>
<tr>
<td>
<label for="text3">请输入真分数的范围：</label></td><td>
<input type="text" name="text3" id="text3" value="10"/>
</td>
</tr>
<tr>
<td>
<label for="text4">请输入真分数分母的范围：</label></td><td>
<input type="text" name="text4" id="text4" value="10" />
</td>
</tr>
<tr>
<td>
<label id="label1">请选择是否需要乘除法？</label></td><td>
<input type="radio" name="radio1" checked="checked" id="radio1" value="y" />
<label for="radio1">是</label>
<input type="radio" name="radio1" id="radio1" value="n" />
<label for="radio1">否</label>
</td>
</tr>
<tr>
<td>
<label id="label2">请选择是否需要括号？</label></td><td>
<input type="radio" checked="checked" name="radio2" id="radio2" value="y" />
<label for="radio2">是</label>
<input type="radio" name="radio2" id="radio2" value="n" />
<label for="radio2">否</label>
</td>
</tr>
<tr>
<td>
<label id="label3">请选择是否需要负数？</label></td><td>
<input type="radio" name="radio3" checked="checked" id="radio3" value="y" />
<label for="radio3">是</label>
<input type="radio" name="radio3" id="radio3" value="n" />
<label for="radio3">否</label>
</td>
</tr>
<tr>
<td>
<label id="label4">请选择是否需要余数？</label></td><td>
<input type="radio" name="radio4" checked="checked" id="radio4" value="y" />
<label for="radio4">是</label>
<input type="radio" name="radio4" id="radio4" value="n" />
<label for="radio4">否</label>
</td>
</tr>
<tr>
<td>
<input type="submit" name="submit" id="submit" value="开始出题"/>
</td>
</tr>
</table>
</form>
</div>
</body>
</html>
接下来是答题页面的代码：
<%@ page contentType="text/html; charset=utf-8" language="java" import="java.sql.*,java.util.*,javabean01.*,javax.sql.*,javax.naming.*" errorPage="" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- TemplateBeginEditable name="doctitle" -->
<title>无标题文档</title>
<!-- TemplateEndEditable -->
<!-- TemplateBeginEditable name="head" -->
<!-- TemplateEndEditable -->
<link href="css/css01.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<%
int number=Integer.parseInt(request.getParameter("text1"));
int i; //用于循环
Random ran=new Random(); //专门用于产生随机数
int ranNumber;//存随机产生的数
//建一个Ways类的对象，用于方法的调用
Ways ways=new Ways();
//用于存储用户的选择
char choice[]=new char[4];
choice[0]=request.getParameter("radio1").charAt(0);
choice[1]=request.getParameter("radio2").charAt(0);
choice[2]=request.getParameter("radio3").charAt(0);
choice[3]=request.getParameter("radio4").charAt(0);
int range1=Integer.parseInt(request.getParameter("text2"));
int range2=Integer.parseInt(request.getParameter("text3"));
int range3=Integer.parseInt(request.getParameter("text4"));%>
<form name=form2 action="jsp02.jsp" method=post>
<%
//清空数据库中原来的东西
Connection conn=null;
Statement stmt=null;
try{
Context ctx=new InitialContext();
DataSource ds=(DataSource)ctx.lookup("java:comp/env/jdbc/calculation");
conn=ds.getConnection();
stmt=conn.createStatement();
String sql="truncate table biaodashi";
stmt.execute(sql);
sql="truncate table anwsy";
stmt.execute(sql);
}
catch(SQLException se){
se.printStackTrace();
}
finally{
if(stmt!=null){
try{
stmt.close();
}
catch(SQLException se)
{
se.printStackTrace();
}
stmt=null;
}
if(conn!=null){
try
{
conn.close();
}
catch(SQLException se)
{
se.printStackTrace();
}
conn=null;
}
}
for(i=1;i<=number;i++){
//开始出题
int ran1=ran.nextInt(8)+1;
switch(ran1){
case 1:
String result1=ways.addInt(range1);
if(result1!=null){
out.println(result1);%><input type="text" class=daan name="text<%=i%>"></input><br/><%
}
else i--;
break;
case 2:
String result2=ways.mimusInt(range1, choice[2]);
if(result2!=null){
out.println(result2);%><input type="text" class=daan name="text<%=i%>"></input><br/><%
}
else i--;
break;
case 3:
String result3=ways.multiplyInt(range1, choice[0]);
if(result3!=null){
out.println(result3);%><input type="text" class=daan name="text<%=i%>"></input><br/><%
}
else i--;
break;
case 4:
String result4=ways.divideInt(range1, choice[0],choice[3]);
if(result4!=null){
out.println(result4); %><input type="text" class=daan name="text<%=i%>"></input><br/><%
}
else i--;
break;
case 5:
String result5=ways.add(range1);
if(result5!=null){
out.println(result5);%><input type="text" class=daan name="text<%=i%>"></input><br/><%
}
else i--;
break;
case 6:
String result6=ways.minus(range1,choice[2]);
if(result6!=null){
out.println(result6);%><input type="text" class=daan name="text<%=i%>"></input><br/><%
}
else i--;
break;
case 7:
String result7=ways.multiply(range1,choice[0]);
if(result7!=null){
out.println(result7);%><input type="text" class=daan name="text<%=i%>"></input><br/><%
}
else i--;
break;
case 8:
String result8=ways.divide(range1,choice[0]);
if(result8!=null){
out.println(result8);%><input type="text" class=daan name="text<%=i%>"></input><br/><%
}
else i--;
break;
}
}
%>
<input type="hidden" name="number" value="<%=number%>"></input>
<input type="submit" value="提交答案"></input>
</form>
</body>
</html>
最后是判断结果页面的代码：
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8" import="java.sql.*,javax.sql.*,javax.naming.*"%>
<!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>Insert title here</title>
<link href="css/css01.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<%
int number=Integer.parseInt(request.getParameter("number"));//获取题目的数量
String tjdaan[]=new String[number];
for(int i=1;i<=number;i++)
{
tjdaan[i-1]=request.getParameter("text"+i);
}
Connection conn=null;
Statement stmt=null;
ResultSet rs=null;
try
{
Context ctx=new InitialContext();
DataSource ds=(DataSource)ctx.lookup("java:comp/env/jdbc/calculation");
conn=ds.getConnection();
stmt=conn.createStatement();
String sql="select daan from anwsy";
rs=stmt.executeQuery(sql);
String daan[]=new String [number];
int i=0;
while(rs.next())
{
daan[i]=new String(rs.getString(1));
i++;
}
//用来存正确或错误题目的编号
int right[]=new int[number];
int rightnumber=0;
int error[]=new int[number];
int errornumber=0;
for(int j=0;j<number;j++)
{
if(daan[j].equals(tjdaan[j]))
{
right[rightnumber]=j+1;
rightnumber++;
}
else
{
error[errornumber]=j+1;
errornumber++;
}
}
//把做题的情况输出去
out.print("做对的题目有：");
for(int j=0;j<rightnumber;j++)
{
if(j==rightnumber-1)
out.println(right[j]);
else
out.print(right[j]+" 、 ");
}
%><br/><%
out.print("做错的题目有：");
for(int j=0;j<errornumber;j++)
{
if(j==errornumber-1)
out.println(error[j]);
else
out.print(error[j]+" 、 ");
}
}
catch(SQLException se)
{
se.printStackTrace();
}
finally
{
if(rs!=null)
{
try{
rs.close();
}
catch(SQLException se)
{
se.printStackTrace();
}
rs=null;
}
if(stmt!=null)
{
try{
stmt.close();
}
catch(SQLException se)
{
se.printStackTrace();
}
stmt=null;
}
if(conn!=null)
{
try{
conn.close();
}
catch(SQLException se)
{
se.printStackTrace();
}
conn=null;
}
}
%>
</body>
</html>
以上部分是前端的实现，接下来的代码是以前实现的功能代码（也就是后台程序）：
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8" import="java.sql.*,javax.sql.*,javax.naming.*"%>
<!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>Insert title here</title>
<link href="css/css01.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<%
int number=Integer.parseInt(request.getParameter("number"));//获取题目的数量
String tjdaan[]=new String[number];
for(int i=1;i<=number;i++)
{
tjdaan[i-1]=request.getParameter("text"+i);
}
Connection conn=null;
Statement stmt=null;
ResultSet rs=null;
try
{
Context ctx=new InitialContext();
DataSource ds=(DataSource)ctx.lookup("java:comp/env/jdbc/calculation");
conn=ds.getConnection();
stmt=conn.createStatement();
String sql="select daan from anwsy";
rs=stmt.executeQuery(sql);
String daan[]=new String [number];
int i=0;
while(rs.next())
{
daan[i]=new String(rs.getString(1));
i++;
}
//用来存正确或错误题目的编号
int right[]=new int[number];
int rightnumber=0;
int error[]=new int[number];
int errornumber=0;
for(int j=0;j<number;j++)
{
if(daan[j].equals(tjdaan[j]))
{
right[rightnumber]=j+1;
rightnumber++;
}
else
{
error[errornumber]=j+1;
errornumber++;
}
}
//把做题的情况输出去
out.print("做对的题目有：");
for(int j=0;j<rightnumber;j++)
{
if(j==rightnumber-1)
out.println(right[j]);
else
out.print(right[j]+" 、 ");
}
%><br/><%
out.print("做错的题目有：");
for(int j=0;j<errornumber;j++)
{
if(j==errornumber-1)
out.println(error[j]);
else
out.print(error[j]+" 、 ");
}
}
catch(SQLException se)
{
se.printStackTrace();
}
finally
{
if(rs!=null)
{
try{
rs.close();
}
catch(SQLException se)
{
se.printStackTrace();
}
rs=null;
}
if(stmt!=null)
{
try{
stmt.close();
}
catch(SQLException se)
{
se.printStackTrace();
}
stmt=null;
}
if(conn!=null)
{
try{
conn.close();
}
catch(SQLException se)
{
se.printStackTrace();
}
conn=null;
}
}
%>
</body>
</html>
运行结果截图：
（主页部分）
（答题部分）
（判断结果部分）
（数据库的表结构）
编程体会与总结：
每一次的任务都能让人学到很多东西，现在我开始认识到，任务的结果对我们来说可能不是最重要的，最重要的应该是做任务的这个过程，
每一个挫折都代表着一次成长，可能说的有点夸张了，但是从每个挫折中，我们都能学到一些意料之外的东西。由于是在解决实际问题中学到的东西，
所有才能记得更加深刻，被动学习与主动学习是截然不同的。
在这次实验中，我感觉自己对于数据库的了解又加深了很多，并且学会了JDBC数据源与连接池的使用方法，懂得了如何运用css+div对页面进行
精美的设计。当然对于运用后台解决问题的逻辑思路更加的清晰了。
以上就是通过这次实验我所学到的东西。