简介
在线做题,计时,有时间设置,时限10分钟,超时提示自动提交,提交后自动评卷,跳转结果页面,显示测试情况和答案。测试题目分章节,点击进入不同章节测试题目不同。
运行截图:
实现
数据库截图
配置
struts.xml
<action name="timu1" class="timuAction" method="timu1">
<result name="success">/site/timu/timuAll.jsp</result>
</action>
<action name="timu" class="timuAction" method="timu">
<result name="success">/site/timu/timu.jsp</result>
</action>
<action name="ziciDafen" class="timuAction" method="ziciDafen">
<result name="success">/site/timu/timuend.jsp</result>
</action>
代码
timuAction.java
timu.action
public class timuAction extends ActionSupport
{
private int id;
private String name;
private String xuanxianga;
private String xuanxiangb;
private String xuanxiangc;
private String xuanxiangd;
private String daan;
private int fenshu;
private String zhangjie;
private String message;
private String path;
private TTimuDAO timuDAO;
//已有题目根据章节分类
public String timu()
{
String sql="from TTimu where del='no' group by zhangjie";
List timuList=timuDAO.getHibernateTemplate().find(sql);
Map request=(Map)ServletActionContext.getContext().get("request");
request.put("timuList", timuList);
return ActionSupport.SUCCESS;
}
timu.jsp
登录过滤,未登录状态不能参加测试,userType==2为学生登录,log为章节参数,通过<c:forEach>输出所有章节名,将章节名存入隐藏文本框中,点击超链接,判断是否登录,已登录便获取隐藏文本框里的章节名,通过超链接带参传入后台action。此处中文传入后台会出现乱码,因为超链接的编码和页面不一致,需在后台转码,不然传入的就是“??????”。
<script type="text/javascript">
function log()
{
<s:if test="#session.userType==null || #session.userType != 2">
alert("请先登录");
</s:if>
<s:if test="#session.userType == 2">
var log = document.getElementById("log").value;
//alert(log);
var strUrl = "<%=path %>/timu1.action?zhangjie="+log;
window.location.href=strUrl;
</s:if>
}
</script>
</head>
<body>
<h2>在线测试</h2>
<div id="welcome">
<div>
<div class="c1-body">
<c:forEach items="${requestScope.timuList}" var="timu" varStatus="sta">
<div class="c1-bline" style="padding:7px 0px;">
<div class="f-left">
<img src="<%=path %>/img/head-mark4.gif" align="middle" class="img-vm" border="0"/>
<a href="#" onclick="log()">${timu.zhangjie }</a>
<input type="text" id="log" value="${timu.zhangjie }" style="display:none"/>
</div>
<div class="clear"></div>
</div>
</c:forEach>
<div class="pg-3"></div>
</div>
</div>
<!-- <p class="more"><a href="#">more</a></p> -->
</div>
</body>
中文传入action后转换一下编码格式。
z = new String(zhangjie.getBytes("ISO-8859-1"),"UTF-8");
timu1.action
通过传入的章节名在数据库搜索相应的题目,采用的模糊查询,并用ActionContext存入转换后的章节数据。
public String timu1()
{
String z = null;
try {
z = new String(zhangjie.getBytes("ISO-8859-1"),"UTF-8");
} catch (UnsupportedEncodingException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
System.out.println(z);
String sql="from TTimu where del='no' AND zhangjie like'%"+z+"%'";
List timuList=timuDAO.getHibernateTemplate().find(sql);
Map request=(Map)ServletActionContext.getContext().get("request");
request.put("timuList", timuList);
ActionContext.getContext().put("z", z);
return ActionSupport.SUCCESS;
}
timuAll.jsp
计时功能,采用的间歇调用的方法,输出格式为00:00:00。
function two_char(n){
return n >=10 ? n :"0" + n;}
function examTime(){
var sec = 0;
setInterval(function(){
sec++;
var date = new Date(0,0);
date.setSeconds(sec);
var h=date.getHours(),m=date.getMinutes(),s=date.getSeconds();
document.getElementById("time").innerText=sec;
document.getElementById("time1").innerText=two_char(h)+":"+two_char(m)+":"+two_char(s);
if(sec==600){
alert("考试结束!");
document.formAdd.submit();
}
},1000);
}
开始测试
<body onload="examTime()">
<h2>在线测试</h2>
<div id="welcome">
<div>
<div class="c1-body">
<form action="<%=path %>/ziciDafen.action" name="formAdd" method="post">
<h3>测试已开始,请开始作答 <span id="time1" style="color:red"></span>
<input type="text" id="time" name="time" readonly="readonly" style="display:none"/>
<input type="text" value="${z }" name="z" readonly="readonly" style="display:none"/></h3>
<c:forEach items="${requestScope.timuList}" varStatus="sta" var="timu">
<table cellspacing="5" cellpadding="5">
<tr>
<td>
${sta.index+1 }:${timu.name }(<font color="red">${timu.fenshu }分</font>)
</td>
</tr>
<tr>
<td align="left">
A:<input type="radio" name="${timu.id}" value="A" style="border: 0"/>${timu.xuanxianga }<br/>
B:<input type="radio" name="${timu.id}" value="B" style="border: 0"/>${timu.xuanxiangb }<br/>
C:<input type="radio" name="${timu.id}" value="C" style="border: 0"/>${timu.xuanxiangc }<br/>
D:<input type="radio" name="${timu.id}" value="D" style="border: 0"/>${timu.xuanxiangd }<br/>
</td>
</tr>
</table>
<br/>
</c:forEach>
<%-- <input type="button" value="提交" onclick="main();"/>--%>
<input type="submit" value="提交" style="width: 80px;"/></form>
<div class="pg-3"></div>
</div>
</div>
<!-- <p class="more"><a href="#">more</a></p> -->
</div>
</body>
zicidafen.action
评卷统分得出情况。
public String ziciDafen()
{
int score=0;
int right=0;
HttpServletRequest request=ServletActionContext.getRequest();
String time1=request.getParameter("time");
int a=Integer.parseInt(time1);
System.out.println(time1);
//b为分钟,c为秒钟
int b=0,c=0;
b=a/60;c=a%60;
Enumeration paraNames =request.getParameterNames();
ArrayList paraNameList = new ArrayList();
while (paraNames.hasMoreElements())
{
paraNameList.add(paraNames.nextElement());
}
for (int i = 0; i < paraNameList.size(); i++)
{
String httpParamName = (String) paraNameList.get(i);
if(!httpParamName.equals("time")){
if(!httpParamName.equals("z")){
String daan = request.getParameter(httpParamName);
String daan1=timuDAO.findById(Integer.parseInt(httpParamName)).getDaan();
if(daan.equalsIgnoreCase(daan1))
{
right+=1;
score+=timuDAO.findById(Integer.parseInt(httpParamName)).getFenshu();
}
} }}
ActionContext.getContext().put("score", score);
ActionContext.getContext().put("right", right);
ActionContext.getContext().put("time", time1);
ActionContext.getContext().put("b", b);
ActionContext.getContext().put("c", c);
String z=request.getParameter("z");
System.out.println(z);
String sql="from TTimu where del='no' AND zhangjie like'%"+z+"%'";
List timuList=timuDAO.getHibernateTemplate().find(sql);
Map request1=(Map)ServletActionContext.getContext().get("request");
request1.put("timuList", timuList);
return ActionSupport.SUCCESS;
}
最后得出成绩情况和答案的页面timuend.jsp代码和timuAlll.jsp差不多,就删掉了计时功能,在前面加了个考试结果,后面多输出了个答案。
测试结果
<div><h3>您一共答对<font color="red">${right }</font>题,
花了<font color="red">${b }</span></font>分<font color="red">${c }</span></font>秒,
分数为<font color="red">${score }</font>分</h3></div>
答案
(<font color="red">${timu.daan }</font>)
完成!