js实现简易知识考卷(2)—— 随机顺序出题
<html><center><div style="font-size:64px;color:brown;font-family:'仿宋_GB2312';font-weight:bold">简易知识测试</div></center>
<hr>
<SCRIPT LANGUAGE="JavaScript">
//http://www.
//以下的内容都可以添加、删除,更改等,包括设定新的卷子问题、答案设定与答案校对等,代码编辑类同已有,举一反三。
//以下设定问题答案
var messages = new Array(6);
var messa;
messa = "11分";
messa2 = "15分";
messages[0] = "";
messages[1] = "北京";
messages[2] = "1978年";
messages[3] = "红色";
messages[4] = "Ballpen";
messages[5] = "Calendar";
//刷新页面,清除题目
function refre(){
window.location.reload(true);
}
function hidden_visi()
{
document.all["a1"].style.visibility='hidden';
document.all["a2"].style.visibility='hidden';
document.all["a3"].style.visibility='hidden';
document.all["a4"].style.visibility='hidden';
document.all["a5"].style.visibility='hidden';
document.all["a0"].style.visibility='hidden';
}
function prepare()
{
document.messageForm.t1.value="";
document.messageForm.m1.value="";
document.messageForm.m2.value="";
for (i=0;i<4;i++)
{
document.messageForm.rd1[i].checked="false";
document.messageForm.rd2[i].checked="false";
}
for (i=0;i<6;i++)
{
document.messageForm.fx[i].checked="false";
}
for (t=0;t<1000;t++)
{
setTimeout("give_questions()",1); //这里是为了保证出题,因为while语句执行时间很短,页面更新后题目出来的数量有限。这里执行1000条循环就是为了确保所有题目能出来。如果题目更多,最好要设为10000,100000等以上。
}
}
//以下出题
var i=35,i2=270;
var p=0;
var ID=0;
function give_questions()
{
var qNo = Math.round(5*Math.random());
while (document.all["a" + qNo].style.visibility=='hidden')
{
//var b="1)";
//eval('document.all["a" + qNo].innerHTML=b');
document.all["a" + qNo].style.visibility='visible';
document.all["a" + qNo].style.top=180+i; //设置题目的行距
if (qNo==1)
i=i+160; //有的题目是下拉框、textarea大文本的模式,占据的高度比较大,在此设定加大行距再出下一题,这样不会出现题目重叠
else
i=i+40;
if (document.all["a1"].style.visibility=='visible' && document.all["a2"].style.visibility=='visible' && document.all["a3"].style.visibility=='visible' && document.all["a4"].style.visibility=='visible' && document.all["a5"].style.visibility=='visible' && document.all["a0"].style.visibility=='visible')
break;
if (document.all["a" + qNo].style.visibility=='visible')
{
qNo = Math.round(5*Math.random());
continue;
}
}
}
//以下为答案校对
function messageReveal() {
var messageindex = document.messageForm.x1.selectedIndex;
document.messageForm.t1.value = messages[messageindex];
}
function messageReveal2() {
document.messageForm.m1.value = messa;
}
function messageReveal22() {
document.messageForm.m2.value = messa2;
}
function messageReveal3() {
var rd=document.getElementsByName("rd1");
if (rd[2].checked) alert("正确");
else alert("错误");
}
function messageReveal4() {
var rd=document.getElementsByName("rd2");
if (rd[0].checked) alert("正确");
else alert("错误");
}
function messageReveal5() {
var fx=document.getElementsByName("fx");
if (fx[0].checked && fx[2].checked && fx[1].checked==false && fx[3].checked==false && fx[4].checked==false && fx[5].checked==false) alert("正确");
else if (fx[0].checked && fx[2].checked==false && fx[1].checked==false && fx[3].checked==false && fx[4].checked==false && fx[5].checked==false) alert("答案不完整");
else if (fx[2].checked && fx[0].checked==false && fx[1].checked==false && fx[3].checked==false && fx[4].checked==false && fx[5].checked==false) alert("答案不完整");
else alert("错误");
}
window.onload = hidden_visi;
</SCRIPT>
<style>
.b1{
border-left-style:none; border-right-style:none; border-top-style:none; border-bottom-color:#827315; border-bottom-width:1px; border-bottom-style:solid;
}
</style>
<body>
<form name="messageForm">
<div>
<input type=button name="chuti" value="查看题目(出题)" OnClick="prepare()">
<input type=button name="chuti2" value="清空题目" OnClick="refre()">
</div>
<span id="a1" style="position:absolute">
<select name="x1" OnChange="messageReveal()">
<option value="0">点击下拉框选择内容查看
<option>中国的首都在哪里?
<option>中国实行改革开放的年份?
<option>石蕊试纸遇到酸性物质显示什么颜色?
<option>圆珠笔的英文名称是什么?
<option>日历的英文名称是什么?
</select>
<br><p>
<textarea name="t1" rows=6 cols=50 wrap=virtual></textarea>
</span>
<p><br><br>
<div id="a2" style="position:absolute">乒乓球一局分制:<input type=text name="m1" class="b1">
<input type=button name="b" Onclick="messageReveal2()" value="答案"></div><p>
<div id="a3" style="position:absolute">排球决胜局分制:<input type=text name="m2" class="b1">
<input type=button name="bq" Onclick="messageReveal22()" value="答案"></div><p>
<div id="a4" style="position:absolute">下列最富含维生素C的食物:
<input type=radio name="rd1" value="家禽">家禽
<input type=radio name="rd1" value="鸡蛋">鸡蛋
<input type=radio name="rd1" value="青菜">青菜
<input type=radio name="rd1" value="鱼类">鱼类
<input type=button name="bq" Onclick="messageReveal3()" value="答案">
</div>
<p>
<div id="a5" style="position:absolute">下列最富含维生素B的食物:
<input type=radio name="rd2" value="家禽">家禽
<input type=radio name="rd2" value="鸡蛋">鸡蛋
<input type=radio name="rd2" value="青菜">青菜
<input type=radio name="rd2" value="鱼类">鱼类
<input type=button name="bq2" Onclick="messageReveal4()" value="答案">
</div><p>
<div id="a0" style="position:absolute">下列哪些人物是英国人:
<input type=checkbox name="fx" value="瓦特">瓦特
<input type=checkbox name="fx" value="爱迪生">爱迪生
<input type=checkbox name="fx" value="牛顿">牛顿
<input type=checkbox name="fx" value="爱因斯坦">爱因斯坦
<input type=checkbox name="fx" value="门捷列夫">门捷列夫
<input type=checkbox name="fx" value="居里">居里
<input type=button name="bq3" Onclick="messageReveal5()" value="答案">
</div>
</form>
</body>
</html>