如题，实现网页版四则运算，其中包括判题，避免生成重复的题。我使用了3个jsp文件完成，判题系统只显示正确题数和错误题数。
Start.jsp：初始界面
1 <%@ page language="java" contentType="text/html; charset=UTF-8" 2 pageEncoding="UTF-8"%> 3 <!DOCTYPE html> 4 <html> 5 <head> 6 <meta charset="UTF-8"> 7 <title>四则运算</title> 8 <!-- 设置居中显示 --> 9 <style type="text/css"> 10 .big{ 11 position:absolute; 12 left:50%; 13 margin-left:-100px; 14 top:50%; 15 margin-top:-200px; 16 } 17 </style> 18 </head> 19 <body> 20 <div class="big"> 21 <h1>准备答题</h1> 22 <!-- 输入出题数和每行的题目数，将其封存于form表单中，按钮点击判定为true时向指定jsp文件提交表单 --> 23 <form action="Count.jsp"method="post"onsubmit="return Go()"> 24 确认出题数:<input type="text"style="width:40px"id="num"name="num"><br> 25 每行题目数:<input type="text"style="width:40px"id="numh"name="numh"><br> 26 <input type="submit" value="生成题目"> 27 </form> 28 </div> 29 <!-- 判断输入格式是否正确 --> 30 <script type="text/javascript"> 31 function Go(){ 32 //验证数字的正则表达式 33 var x="^[0-9]*$"; 34 //抓取文本框中输入的字符串 35 var a=document.getElementById("num").value; 36 var b=document.getElementById("numh").value; 37 //判断 38 if(!a.match(x)){ 39 alert("请输入正整数"); 40 return false; 41 } 42 else if(!b.match(x)){ 43 alert("请输入正整数"); 44 return false; 45 } 46 } 47 </script> 48 </body> 49 </html>
此JSP文件是初始界面，将所要传达的题目信息封存在form表单中，利用onsubmit()实现验证提交，验证方法用js编写。
效果演示：
如果输入成功，通过form提交表单到Count.jsp文件，开始生成题目。
Count.jsp：生成题目
1 <%@ page language="java" contentType="text/html; charset=UTF-8" 2 pageEncoding="UTF-8"%> 3 <!DOCTYPE html> 4 <html> 5 <head> 6 <meta charset="UTF-8"> 7 <title>COUNT</title> 8 <!-- 设置字体大小，以及table的属性 --> 9 <style type="text/css"> 10 .big{ 11 font-size:20px; 12 } 13 table { 14 margin: auto; 15 } 16 </style> 17 </head> 18 <!-- 设置居中 --> 19 <body style="text-align: center;"> 20 <div class="big"> 21 <!-- 在表单中创建题目和文本框，结果提交至Judge.jsp --> 22 <form action="Judge.jsp"method="post"> 23 <table> 24 <% 25 //将Start.jsp文件中form提交的信息抓取过来 26 request.setCharacterEncoding("utf-8"); 27 //文本框内输入为字符串形式，转化为int型 28 int n=Integer.parseInt(request.getParameter("num")); 29 int m=Integer.parseInt(request.getParameter("numh")); 30 //随机生成的，参与运算的第一个数存进q1数组 31 int q1[]=new int[n]; 32 //随机生成的，代表符号的数存进q2数组 33 int q2[]=new int[n]; 34 //随机生成的，参与运算的第二个数存进q3数组 35 int q3[]=new int[n]; 36 int t=0; 37 for(int i=1;i<=n;i++){ 38 //一行设置成一个表格，便于排版 39 if(t==0){ 40 //通过out.print写入“<tr>” 41 out.print("<tr>"); 42 t=1; 43 } 44 //k1为参与运算的第一个数，范围1-99 45 int k1=(int)(Math.random()*99+1); 46 //k为代表运算符号的数，范围1-4，对应加减乘除 47 int k=(int)(Math.random()*4+1); 48 if(k==1){ 49 int k2=(int)(Math.random()*99+1); 50 //执行查重操作，避免生成相同题目 51 if(i>1){ 52 for(int j=0; j<i; j++){ 53 if(q1[j]==k1){ 54 if(q2[j]==k){ 55 while(q3[j]==k2){ 56 k2=(int)(Math.random()*99+1); 57 } 58 } 59 } 60 } 61 } 62 //确认题目生成后，将各数值存入相应数组，算式存入时数组下标相同 63 q1[i-1]=k1;q2[i-1]=k;q3[i-1]=k2; 64 //题号，数值，符号作为一个表格 65 out.println("<td>"+i+"、 "+k1+"+"+k2+"="+"</td>"); 66 //文本框作为一个表格 67 out.println("<td>"+"<input type='text'name='inp'style='width:40px'>"+"</td>"); 68 String rel=(k1+k2)+""; 69 //正确答案写入这个文本框，该文本框在页面中是隐式的 70 out.print("<input type='hidden'name='inpr'value='"+rel+"'>"); 71 } 72 else if(k==2){ 73 int k2=(int)(Math.random()*99+1); 74 //判定谁是被减数 75 if(k1>=k2){ 76 //查重 77 if(i>1){ 78 for(int j=0; j<i; j++){ 79 if(q1[j]==k1){ 80 if(q2[j]==k){ 81 while(q3[j]==k2){ 82 k2=(int)(Math.random()*99+1); 83 } 84 } 85 } 86 } 87 } 88 //写入 89 q1[i-1]=k1;q2[i-1]=k;q3[i-1]=k2; 90 //表格 91 out.println("<td>"+i+"、 "+k1+"-"+k2+"="+"</td>"); 92 //表格 93 out.println("<td>"+"<input type='text'name='inp'style='width:40px'>"+"</td>"); 94 }else{ 95 //查重 96 if(i>1){ 97 for(int j=0; j<i; j++){ 98 if(q1[j]==k2){ 99 if(q2[j]==k){ 100 while(q3[j]==k1){ 101 k1=(int)(Math.random()*99+1); 102 } 103 } 104 } 105 } 106 } 107 //写入 108 q1[i-1]=k2;q2[i-1]=k;q3[i-1]=k1; 109 //表格 110 out.println("<td>"+i+"、 "+k2+"-"+k1+"="+"</td>"); 111 //表格 112 out.println("<td>"+"<input type='text'name='inp'style='width:40px'>"+"</td>"); 113 } 114 //隐式框写入答案 115 String rel=(k1-k2)+""; 116 out.print("<input type='hidden'name='inpr'value='"+rel+"'>"); 117 } 118 else if(k==3){ 119 int k2=(int)(Math.random()*99+1); 120 //乘法运算结果不超过两位数 121 while(k1*k2>100){ 122 k2=(int)(Math.random()*99+1); 123 } 124 //查重 125 if(i>1){ 126 for(int j=0; j<i; j++){ 127 if(q1[j]==k1){ 128 if(q2[j]==k){ 129 while(q3[j]==k2){ 130 k2=(int)(Math.random()*99+1); 131 while(k1*k2>100){ 132 k2=(int)(Math.random()*99+1); 133 } 134 } 135 } 136 } 137 } 138 } 139 //写入 140 q1[i-1]=k1;q2[i-1]=k;q3[i-1]=k2; 141 //表格 142 out.println("<td>"+i+"、 "+k1+"*"+k2+"="+"</td>"); 143 //表格 144 out.println("<td>"+"<input type='text'name='inp'style='width:40px'>"+"</td>"); 145 String rel=(k1*k2)+""; 146 //隐式框写入答案 147 out.print("<input type='hidden'name='inpr'value='"+rel+"'>"); 148 } 149 else if(k==4){ 150 int k2=(int)(Math.random()*99+1); 151 //整除 152 while(k1%k2!=0){ 153 k2=(int)(Math.random()*99+1); 154 } 155 //查重 156 if(i>1){ 157 for(int j=0; j<i; j++){ 158 if(q1[j]==k1){ 159 if(q2[j]==k){ 160 while(q3[j]==k2){ 161 k2=(int)(Math.random()*99+1); 162 while(k1%k2!=0){ 163 k2=(int)(Math.random()*99+1); 164 } 165 } 166 } 167 } 168 } 169 } 170 //写入 171 q1[i-1]=k1;q2[i-1]=k;q3[i-1]=k2; 172 //表格 173 out.println("<td>"+i+"、 "+k1+"/"+k2+"="+"</td>"); 174 //表格 175 out.println("<td>"+"<input type='text'name='inp'style='width:40px'>"+"</td>"); 176 String rel=(k1/k2)+""; 177 //隐式框写入答案 178 out.print("<input type='hidden'name='inpr'value='"+rel+"'>"); 179 } 180 //达到每行出题数要求时换行 181 if(i%m==0){ 182 out.println("</tr>"); 183 t=0; 184 } 185 } 186 %> 187 </table> 188 <input type="submit" value="提交"> 189 </form> 190 </div> 191 </body> 192 </html>
此jsp文件用于生成题目，通过for循环和if-else语句即可实现，在生成格式上，这里使用了<table>，由于在编写代码时尚未熟练掌握<% %>，因此相关的<input>文本框inp，<tr>，<td>都是通过out.print()或out.println()写入。此外，为了实现判题功能，我在生成算式时计算出了答案，写入了另一个文本框inpr中，将其设置成了'hidden'属性，即隐式，这样不会在页面中显示出来，其作用是跟随inp文本框一起提交到Judge.jsp文件中。这里要提一点，生成的文本框name名字一样时，存在多个文本框的情况下其会变成字符串数组，也是利用这个功能我才能实现判题功能。下面来看看生成效果：
【出题数：10；每行题目数：1】
【出题数：100；每行题目数：4】
Judge.jsp：显示结果（附带返回Start.jsp文件的超链接）
1 <%@ page language="java" contentType="text/html; charset=UTF-8" 2 pageEncoding="UTF-8"%> 3 <!DOCTYPE html> 4 <html> 5 <head> 6 <meta charset="UTF-8"> 7 <title>判断</title> 8 <!-- 设置居中格式--> 9 <style type="text/css"> 10 .big{ 11 position:absolute; 12 left:50%; 13 margin-left:-100px; 14 top:50%; 15 margin-top:-200px; 16 } 17 </style> 18 </head> 19 <body> 20 <div class="big"> 21 <% 22 //将Count.jsp中提交的两个存储文本框输入的字符串的字符串数组抓取出来 23 request.setCharacterEncoding("utf-8"); 24 String []s=request.getParameterValues("inp"); 25 String []sr=request.getParameterValues("inpr"); 26 //记录正确题数 27 int right=0; 28 //记录错误题数 29 int wrong=0; 30 //判定 31 for(int i=0;i<s.length;i++){ 32 if(s[i].equals(sr[i])){ 33 right++; 34 }else{ 35 wrong++; 36 } 37 } 38 //输出 39 out.println("总题数:"+s.length+"<br/>"); 40 out.println("正确题数:"+right+"<br/>"); 41 out.println("错误题数:"+wrong+"<br/>"); 42 %> 43 <!-- 跳转回初始页面的超链接 --> 44 <a href="Start.jsp">再次尝试</a> 45 </div> 46 </body> 47 </html>
由于在Count.jsp中每生成一个算式便写入一个答案，因此两个文本框的字符串数组对应下标就是对应的题目及答案，在遍历时直接比较即可达成判题效果，最后在输出结果下端附上了返回初始界面的超链接。
查看效果
完成。