设计思想:
生成两个(1-100)的随机数,再随机生成一个(1-4)的随机数随机数分别代表加减乘除,最后用一个for循环确定生成多少个运算题目。
用决定定位和相对定位固定输入框的位置。
代码
mainInput.jsp
<%@ 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>
<title>四则运算</title>
<style>
.fixed{
position: fixed;
top: 10%;
left: 38%;
right: 200;
margin:0 auto;
}
</style>
</head>
<body style = "background:url(../images/5.gif) no-repeat">
<div align = "center" class = "fixed">
<form action = "main.jsp" method = "get">
<table>
<%
if(request.getAttribute("error") == null)
{
out.println("请输入");
}
else
{
out.println(request.getAttribute("error"));
}
%>
<tr>
<td>请输入出题的个数</td>
<td><input type="text" size = 2 name = "num" onkeyup="value=value.replace(/[^(d)]/g,'')"/><td>
</tr>
<tr>
<td>请输入时间限制(秒)</td>
<td><input type="text" size =2 name = "time" onkeyup="value=value.replace(/[^(d)]/g,'')"/><td>
</tr>
<tr>
<td>是否有综合运算</td>
<td><input type = "radio" name = "have" value = "1">有</td>
<td><input type = "radio" name = "have" value = "0" checked>没有</td>
</tr>
</table>
<br/>
<input type = "submit" value = "提交">
</form>
</div>
</body>
</html>
main.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@page import="com.jaovo.msg.model.Ti"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<style>
.fixed{
position: relative;
500px;
height:500 px;
top: 50%;
left: 8%;
right: 200;
margin:0 auto;
}
</style>
<body style = "background:url(../images/8.jpg ) repeat-y">
<form action = "chengji.jsp" name = "grade" method = "post">
<div class = "fixed">
<%
//接收传递的出题数
String geshu = request.getParameter("num");
String shijian = request.getParameter("time");
String zonghe = request.getParameter("have");
if("".equals(geshu)||"".equals(shijian))
{
request.setAttribute("error", "输入框不能为空!!!");
%>
<jsp:forward page = "mainInput.jsp"></jsp:forward>
<%
}
int num = Integer.parseInt(geshu);
int t = Integer.parseInt(shijian);
int sign = Integer.parseInt(zonghe);
if(num>10000||t>10000)
{
request.setAttribute("error", "请输入一个小于10000的正整数");
%>
<jsp:forward page = "mainInput.jsp"></jsp:forward>
<%
}
Ti ti = new Ti();
ti.setTinum(num);
for(int i = 0;i<num;i++)
{
int first = ti.random(33);
int second = ti.random(33);
int symbol = ti.randomSymbol();
if(symbol == 1)
{
if(sign == 1)
{
int third = ti.random(33);
ti.setResult(i, (first+second+third));
%>
<h1><%= (i+1)+"、" +first+"+"+second+"+"+third+"="%>
<input type = "text" name = "input" size = "1" onkeyup="value=value.replace(/[^(d)]/g,'')"/>
</h1>
<%
}
else
{
ti.setResult(i, (first+second));
%>
<h1><%= (i+1)+"、" +first+"+"+second+"="%>
<input type = "text" name = "input" size = "1" onkeyup="value=value.replace(/[^(d)]/g,'')"/>
</h1>
<%
}
}
%>
<%
if(symbol == 2)
{
if(first > second)
{
ti.setResult(i, (first-second));
%>
<h1><%= (i+1)+"、" +first+"-"+second+"="%>
<input type = "text" name = "input" size = "1" onkeyup="value=value.replace(/[^(d)]/g,'')"/>
</h1>
<%
}
else
{
ti.setResult(i, -(first-second));
%>
<h1><%= (i+1)+"、" +second+"-"+first+"="%>
<input type = "text" name = "input" size = "1" onkeyup="value=value.replace(/[^(d)]/g,'')"/>
</h1>
<%
}
}
if(symbol ==3)
{
first = ti.random(9);
second = ti.random(9);
ti.setResult(i, (first*second));
%>
<h1><%= (i+1)+"、" +second+"*"+first+"="%>
<input type = "text" name = "input" size = "1" onkeyup="value=value.replace(/[^(d)]/g,'')"/>
</h1>
<%
}
if(symbol == 4)
{
second = ti.random(9);
first = ti.random(9)*second;
ti.setResult(i, (first/second));
%>
<h1><%= (i+1)+"、" +first+"/"+second+"="%>
<input type = "text" name = "input" size = "1" onkeyup="value=value.replace(/[^(d)]/g,'')"/>
</h1>
<%
}
}
%>
<br/>
<%
session.setAttribute("result", ti);
%>
<div id="showTimes"></div>
<script>
var second = <%= t%>;// 剩余秒数
// 写一个方法,将秒数专为天数
var toDays = function(){
var s = second ; // 秒
return s;
}
window.setInterval(function(){
second --;
document.getElementById("showTimes").innerHTML = toDays ();
if(document.getElementById("showTimes").innerHTML == 0)
{
document.grade.submit();
}
}
, 1000);
</script>
<input type = "submit" value = "提交">
</div>
</form>
</body>
key.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@page import="com.jaovo.msg.model.Ti"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<body style = "background:url(../images/11.jpg) repeat-y">
<div align = "center">
<font size = "10">参考答案</font>
<br/>
<%
Ti ti = new Ti();
ti = (Ti)request.getSession().getAttribute("result");
int result[] = ti.getResult();
for(int i = 0;i<ti.getTinum();i++)
{
%>
<h1>第<%=(i+1) %>题:<%=result[i] %></h1>
<%
}
%>
</div>
</body>
chengji.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@page import="com.jaovo.msg.model.Ti"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<body style = "background:url(../images/12.jpg) repeat-y">
<%
String []numInput = request.getParameterValues("input");
Ti ti = (Ti)session.getAttribute("result");
int []numresult = ti.getResult();
int right = 0;
int notright = 0;
for(int i = 0;i<numInput.length;i++)
{
if("".equals(numInput[i]))
{
notright+=1;
out.print("您没有作答第"+(i+1)+"道题");
%>
<br/>
<%
continue;
}
if(numresult[i] != Integer.parseInt(numInput[i]))
{
notright+=1;
out.print("您答错了第"+(i+1)+"道题");
%>
<br/>
<%
}
if(numresult[i] == Integer.parseInt(numInput[i]))
{
right = right +1;
}
}
%>
<br/>
<br/>
<%
out.print("您一共答对了"+right+"道题");
%>
<br/>
<%
out.print("您一共答错了"+notright+"道题");
%>
<br/>
<%
out.print("您的得分是"+((double)right/(right+notright)*100));
%>
<br/>
<a href = "key.jsp" ><font color = "red" size = "10">参考答案</font></a>
<a href = "mainInput.jsp" ><font color = "red" size = "10">重新出题</font></a>
</body>
截图: