简易的考试系统设计（Web实验）
- 1.实验内容与设计思想
- （一）实验需求
- （二）设计思路
- 2.代码展示
- 3.实验小结
1.实验内容与设计思想
（一）实验需求
1.编写两个页面程序，一个HTML页面作为准化考试页面（含有单选、多选、判断题），另一个是JSP评分页面，用于呈现最终的成绩以及其它答题信息反馈。
2.编写后台程序，基于Servlet类，处理提交的答题信息，并返回给评分页面。
（二）设计思路
一、考试页面
1.h1标签设置标题，添加居中样式
2.h3标签显示题型
3.form标签用来创建表单，指明action=‘./result’，method=‘post’
4.label标签显示题目以及选项，添加for=‘id’，使其点击label标签等于点击对应的单选（复选）框，能够增大点击范围
5.input标签，设置type值为radio、checkbox，创建单选框以及复选框，设置name以及id
6.button标签，用来提交表单
效果：
二、后台数据处理
1.获取所有题目的正确答案：创建一维数组(String[] sum)来存储正确答案
2.获取提交的答案：创建String[] 型变量s1，通过request.getParameter()获取用户选择的答案赋值给s1
3.统计总分以及答对总数：创建变量score以及一维数组n[4]（n数组的1~3下标用来存放各个题型的答对题数），遍历sum以及s1，判断二者是否相等。若相等，则score累加10（默认每题10分）,n[0]++,用来统计答对的总提数。并且对于不同的题型，进行不同的累加
4.通过request.setAttribute()，将score以及n数组存储起来，并通过请求转发给评分页面，使得评分页面能够获取这些数据
通过
三、评分页面
使用el表达式${}，将后台传来的数据嵌入Html代码中，展示出来
使用ul列表，将各种题型答对的总数展示出来
效果：
2.代码展示
考试页面：
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>C引言考试</title><style>*{margin: 0;padding: 0;}body{background-color: #716969;}.divs{background-color: rgba(255,255,255,0.4);;margin: auto;width: 600px;padding: 15px;}.d1{margin-top: 10px;margin-bottom: 10px;}h1{text-align: center;}label{margin-right: 35px;}button{display: block;margin: auto;margin-bottom: 7px;}</style>
</head>
<body>
<!--单选题-->
<!--多选题-->
<!--判断题--><div class="divs"><h1>C语言测试</h1><form action="./result" method="post"><h3>单选题（共三道，30分）</h3><div class="d1"><label>1. 什么是构成C语言程序的基本单位</label><br><input type="radio" name="q1" id="l11" value="A"><label for="l11">A. 函数</label><input type="radio" name="q1" id="l12" value="B"><label for="l12">B. 过程</label><input type="radio" name="q1" id="l13" value="C"><label for="l13">C. 子程序</label><input type="radio" name="q1" id="l14" value="D"><label for="l14">D. 子例程</label></div><div class="d1"><label>2. C语言表达式（ ）的值不等于1。</label><br><input type="radio" name="q2" id="l21" value="A"><label for="l21">A. 123/100</label><input type="radio" name="q2" id="l22" value="B"><label for="l22">B. 901%10</label><input type="radio" name="q2" id="l23" value="C"><label for="l23">C. 76%3</label><input type="radio" name="q2" id="l24" value="D"><label for="l24">D. 625%5</label></div><div class="d1"><label>3. C语言表达式（ ）的值不等于1。</label><br><input type="radio" name="q3" id="l31" value="A"><label for="l31">A. *</label><input type="radio" name="q3" id="l32" value="B"><label for="l32">B. ==</label><input type="radio" name="q3" id="l33" value="C"><label for="l33">C. =</label><input type="radio" name="q3" id="l34" value="D"><label for="l34">D. %</label></div><h3>多选题（共两道，20分，全选对才有分）</h3><div class="d1"><label>4. C语言表达式（ ）的值不等于1。</label><br><input type="checkbox" name="q4" id="l41" value="A"><label for="l41">A. *</label><input type="checkbox" name="q4" id="l42" value="B"><label for="l42">B. ==</label><input type="checkbox" name="q4" id="l43" value="C"><label for="l43">C. =</label><input type="checkbox" name="q4" id="l44" value="D"><label for="l44">D. %</label></div><div class="d1"><label>5. C语言表达式（ ）的值不等于1。</label><br><input type="checkbox" name="q5" id="l51" value="A"><label for="l51">A. *</label><input type="checkbox" name="q5" id="l52" value="B"><label for="l52">B. ==</label><input type="checkbox" name="q5" id="l53" value="C"><label for="l53">C. =</label><input type="checkbox" name="q5" id="l54" value="D"><label for="l54">D. %</label></div><h3>判断题（共五道，50分）</h3><div class="d1"><label>6. 如果变量已经正确定义，则表达式fahr ++ 与fahr + 1等价。</label><br><input type="radio" name="q6" id="l61" value="A"><label for="l61"> T</label><input type="radio" name="q6" id="l62" value="B"><label for="l62"> F</label></div><div class="d1"><label>7. C程序中，用一对大括号{}括起来的多条语句称为复合语句，复合语句在语法上被认为是一条语句。 </label><br><input type="radio" name="q7" id="l71" value="A"><label for="l71"> T</label><input type="radio" name="q7" id="l72" value="B"><label for="l72"> F</label></div><div class="d1"><label>8. 循环体如包括有一个以上的语句，则必须用一对大括号{}括起来，组成复合语句，复合语句在语法上被认为是一条语句。 </label><br><input type="radio" name="q8" id="l81" value="A"><label for="l81"> T</label><input type="radio" name="q8" id="l82" value="B"><label for="l82"> F</label></div><div class="d1"><label>9. 在C语言中，仅由一个分号（;）构成的语句称为空语句，它什么也不做。 </label><br><input type="radio" name="q9" id="l91" value="A"><label for="l91"> T</label><input type="radio" name="q9" id="l92" value="B"><label for="l92"> F</label></div><div class="d1"><label>10. 调用输入输出库函数时，编译预处理命令为#include <stdio.h>。 </label><br><input type="radio" name="q10" id="l101" value="A"><label for="l101"> T</label><input type="radio" name="q10" id="l102" value="B"><label for="l102"> F</label></div><button>提交</button></form>
</div>
</body>
</html>
后台数据处理：
package com;import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
@WebServlet("/result")
public class result extends HttpServlet {protected void doPost(javax.servlet.http.HttpServletRequest request, javax.servlet.http.HttpServletResponse response) throws javax.servlet.ServletException, java.io.IOException {response.setContentType("text/plain;charset=UTF-8");
// 存放前端答案String[] s1=new String[10];
// 应该将答案放在数据库中，需要时读取String[] sum={"A","D","C","AB","CD","A","A","A","A","A"};String s2="q";for(int i=0;i<10;i++){int t=i+1;s1[i]=request.getParameter(s2+t);}int[] n=new int[4];double score=0;
// 多选，单选，判断没分开for(int i=0;i<10;i++){int yy=0;if(s1[i]==null){i++;continue;}for(int j=0;j<s1[i].length();j++){if(s1[i].charAt(j)!=sum[i].charAt(j)){yy=1;break;}}if(yy==0){n[0]++;score+=10;if(i<3){n[1]++;}else if(i<5){n[2]++;}else{n[3]++;}}}request.setAttribute("score",score);request.setAttribute("n",n);request.getRequestDispatcher("result.jsp").forward(request, response);}
}评分页面：
<%--Created by IntelliJ IDEA.User: 86135Date: 2025/5/8Time: 19:56To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head><title>Title</title><style>.tc{color: green;}h1{text-align: center;}div{font-size: 20px;}</style>
</head>
<body>
<%int[] n=(int[]) request.getAttribute("n");int yy=0;if(n[0]==10){yy=1;out.println("<h1 class=\"tc\" >恭喜你，全部答题正确</h1>");}
%>
<h1>本次得分为${score}，共答对${n[0]}道题</h1>
<div><label>各类题型答对题数：</label><br><ul><li>单选题：${n[1]}</li><li>多选题：${n[2]}</li><li>判断题：${n[3]}</li></ul>
</div></body>
</html>3.实验小结
（一）在Jsp中，将数据嵌套在html代码中，可以通过out.print()将html代码与数据拼接，在页面中展示；也可以通过el表达式${}，直接在html代码嵌入。
（二）使用请求转发 request.getRequestDispatcher(“page”).forward(request, response)，可以共享request以及response，实现数据的共享，并且页面的url不会发生改变。
（三）将正确答案以及选项的顺序写死，会带来安全隐患。需要改进，使其每次访问页面，题目的顺序以及选项的顺序都会随机改变。
