2. it技术
  3. js+html的简单在线做选择题

js+html的简单在线做选择题

it2024-02-19  56

第一步：新建js文件将下面文件复制到文件中保存。

第二步：新建html文件将代码导入html文件中保存，最后运行就可以看到结果了，目前只有微软的ie、edge浏览器可以运行，谷歌不太支持运行结果。

.js文件

function scorequiz(form) { list=0; switch (form.Q1.value){ case '*': list++; break; case '**': list=list+2; break; case '***': list=list+3; break; case '****': list=list+5; } switch (form.Q2.value){ case '*': list++; break; case '**': list=list+2; break; case '***': list=list+3; break; case '****': list=list+5; } switch (form.Q3.value){ case '*': list++; break; case '**': list=list+2; break; case '***': list=list+3; break; case '****': list=list+5; } switch (form.Q4.value){ case '*': list++; break; case '**': list=list+2; break; case '***': list=list+3; break; case '****': list=list+5; } switch (form.Q5.value){ case '*': list++; break; case '**': list=list+2; break; case '***': list=list+3; break; case '****': list=list+5; } switch (form.Q6.value){ case '*': list++; break; case '**': list=list+2; break; case '***': list=list+3; break; case '****': list=list+5; } switch (form.Q7.value){ case '*': list++; break; case '**': list=list+2; break; case '***': list=list+3; break; case '****': list=list+5; } switch (form.Q8.value){ case '*': list++; break; case '**': list=list+2; break; case '***': list=list+3; break; case '****': list=list+5; } switch (form.Q9.value){ case '*': list++; break; case '**': list=list+2; break; case '***': list=list+3; break; case '****': list=list+5; } switch (form.Q10.value){ case '*': list++; break; case '**': list=list+2; break; case '***': list=list+3; break; case '****': list=list+5; } switch (form.Q11.value){ case '*': list++; break; case '**': list=list+2; break; case '***': list=list+3; break; case '****': list=list+5; } switch (form.Q12.value){ case '*': list++; break; case '**': list=list+2; break; case '***': list=list+3; break; case '****': list=list+5; } switch (form.Q13.value){ case '*': list++; break; case '**': list=list+2; break; case '***': list=list+3; break; case '****': list=list+5; } switch (form.Q14.value){ case '*': list++; break; case '**': list=list+2; break; case '***': list=list+3; break; case '****': list=list+5; } switch (form.Q15.value){ case '*': list++; break; case '**': list=list+2; break; case '***': list=list+3; break; case '****': list=list+5; } switch (form.Q16.value){ case '*': list++; break; case '**': list=list+2; break; case '***': list=list+3; break; case '****': list=list+5; } switch (form.Q17.value){ case '*': list++; break; case '**': list=list+2; break; case '***': list=list+3; break; case '****': list=list+5; } switch (form.Q18.value){ case '*': list++; break; case '**': list=list+2; break; case '***': list=list+3; break; case '****': list=list+5; } switch (form.Q19.value){ case '*': list++; break; case '**': list=list+2; break; case '***': list=list+3; break; case '****': list=list+5; } switch (form.Q20.value){ case '*': list++; break; case '**': list=list+2; break; case '***': list=list+3; break; case '****': list=list+5; } } form.SCORE.value =eval(list) }

.html文件

<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Language" content="zh-cn"> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <script type="text/javascript" src="${pageContext.request.contextPath}/views/js/testJS.js"></script> <title>初步评判</title> </head> <body> <script type="text/javascript" src="js/testJS.js"></script> <center> <font size="6" color="green"><b>详细版</b></font> <h1>初步了解您对本课程的认识程度</h1> <h3 style="color:red;">请务必认真作答</h3> </center><br> <table width="75%" border="0" align="center"> <tr> <td> <form onLoad="clearquiz(this.form)"> 1. 数据结构概念： <ol> <input type="radio" name="Q1" value="A" onClick=Q1.value="*"> 没学过<br> <input type="radio" name="Q1" value="B" onClick=Q1.value="**"> 略懂一点<br> <input type="radio" name="Q1" value="C" onClick=Q1.value="***"> 学过还算熟悉<br> <input type="radio" name="Q1" value="D" onClick=Q1.value="****"> 精通<br> </ol> 2. 数据结构基本概念和术语。 <ol> <input type="radio"name="Q2" value="A" onClick=Q2.value="*"> 没学过<br> <input type="radio" name="Q2" value="B" onClick=Q2.value="**"> 略懂一点<br> <input type="radio" name="Q2" value="C" onClick=Q2.value="***"> 学过还算熟悉<br> <input type="radio" name="Q2" value="D" onClick=Q2.value="****"> 精通<br> </ol> 3. 抽象数据类型的表示与实现： <ol> <input type="radio" name="Q3" value="A" onClick=Q3.value="*"> 没学过<br> <input type="radio" name="Q3" value="B" onClick=Q3.value="**"> 略懂一点<br> <input type="radio" name="Q3" value="C" onClick=Q3.value="***"> 学过还算熟悉<br> <input type="radio" name="Q3" value="D" onClick=Q3.value="****"> 精通<br> </ol> 4. 算法和算法分析： <ol> <input type="radio" name="Q4" value="A" onClick=Q4.value="*"> 没学过<br> <input type="radio" name="Q4" value="B" onClick=Q4.value="**"> 略懂一点<br> <input type="radio" name="Q4" value="C" onClick=Q4.value="***"> 学过还算熟悉<br> <input type="radio" name="Q4" value="D" onClick=Q4.value="****"> 精通<br> </ol> 5. 对算法的设计和效率、算法存储空间的需求的了解： <ol> <input type="radio" name="Q5" value="A" onClick=Q5.value="*"> 没学过<br> <input type="radio" name="Q5" value="B" onClick=Q5.value="**"> 略懂一点<br> <input type="radio" name="Q5" value="C" onClick=Q5.value="***"> 学过还算熟悉<br> <input type="radio" name="Q5" value="D" onClick=Q5.value="****"> 精通<br> </ol> 6. 线性表的类型定义： <ol> <input type="radio" name="Q6" value="A" onClick=Q6.value="*"> 没学过<br> <input type="radio" name="Q6" value="B" onClick=Q6.value="**"> 略懂一点<br> <input type="radio" name="Q6" value="C" onClick=Q6.value="***"> 学过还算熟悉<br> <input type="radio" name="Q6" value="D" onClick=Q6.value="****"> 精通<br> </ol> 7. 线性表的顺序表示实现和链式表示实现： <ol> <input type="radio" name="Q7" value="A" onClick=Q7.value="*"> 没学过<br> <input type="radio" name="Q7" value="B" onClick=Q7.value="**"> 略懂一点<br> <input type="radio" name="Q7" value="C" onClick=Q7.value="***"> 学过还算熟悉<br> <input type="radio" name="Q7" value="D" onClick=Q7.value="****"> 精通<br> </ol> 8. 对链式表示里面的线性、循环、双向链表的了解： <ol> <input type="radio" name="Q8"value="A" onClick=Q8.value="*"> 没学过<br> <input type="radio" name="Q8" value="B" onClick=Q8.value="**"> 略懂一点<br> <input type="radio" name="Q8" value="C" onClick=Q8.value="***"> 学过还算熟悉<br> <input type="radio" name="Q8" value="D" onClick=Q8.value="****"> 精通<br> </ol> 9.类型栈和类型队列的定义 ： <ol> <input type="radio" name="Q9"value="A" onClick=Q9.value="*"> 没学过<br> <input type="radio" name="Q9" value="B" onClick=Q9.value="**"> 略懂一点<br> <input type="radio" name="Q9" value="C" onClick=Q9.value="***"> 学过还算熟悉<br> <input type="radio" name="Q9" value="D" onClick=Q9.value="****"> 精通<br> </ol> 10. 栈、队列的表示和实现： <ol> <input type="radio" name="Q10"value="A" onClick=Q10.value="*"> 没学过<br> <input type="radio" name="Q10" value="B" onClick=Q10.value="**"> 略懂一点<br> <input type="radio" name="Q10" value="C" onClick=Q10.value="***"> 学过还算熟悉<br> <input type="radio" name="Q10" value="D" onClick=Q10.value="****"> 精通<br> </ol> 11.对栈的应用举例、栈与递归的实现的了解 ： <ol> <input type="radio" name="Q11"value="A" onClick=Q11.value="*"> 没学过<br> <input type="radio" name="Q11" value="B" onClick=Q11.value="**"> 略懂一点<br> <input type="radio" name="Q11" value="C" onClick=Q11.value="***"> 学过还算熟悉<br> <input type="radio" name="Q11" value="D" onClick=Q11.value="****"> 精通<br> </ol> 12.串类型的定义、表示和实现 ： <ol> <input type="radio" name="Q12"value="A" onClick=Q12.value="*"> 没学过<br> <input type="radio" name="Q12" value="B" onClick=Q12.value="**"> 略懂一点<br> <input type="radio" name="Q12" value="C" onClick=Q12.value="***"> 学过还算熟悉<br> <input type="radio" name="Q12" value="D" onClick=Q12.value="****"> 精通<br> </ol> 13.对串的模式匹配算法和应用举例的了解 ： <ol> <input type="radio" name="Q13" value="A" onClick=Q13.value="*"> 没学过<br> <input type="radio" name="Q13" value="B" onClick=Q13.value="**"> 略懂一点<br> <input type="radio" name="Q13" value="C" onClick=Q13.value="***"> 学过还算熟悉<br> <input type="radio" name="Q13" value="D" onClick=Q13.value="****"> 精通<br> </ol> 14.对数组和广义表的了解 ： <ol> <input type="radio" name="Q14" value="A" onClick=Q14.value="*"> 没学过<br> <input type="radio" name="Q14" value="B" onClick=Q14.value="**"> 略懂一点<br> <input type="radio" name="Q14" value="C" onClick=Q14.value="***"> 学过还算熟悉<br> <input type="radio" name="Q14" value="D" onClick=Q14.value="****"> 精通<br> </ol> 15.对树、森林与二叉树基本定义和性质的了解： <ol> <input type="radio" name="Q15" value="A" onClick=Q15.value="*"> 没学过<br> <input type="radio" name="Q15" value="B" onClick=Q15.value="**"> 略懂一点<br> <input type="radio" name="Q15" value="C" onClick=Q15.value="***"> 学过还算熟悉<br> <input type="radio" name="Q15" value="D" onClick=Q15.value="****"> 精通<br> </ol> 16.对图定义和术语、存储结构的了解： <ol> <input type="radio" name="Q16" value="A" onClick=Q16.value="*"> 没学过<br> <input type="radio" name="Q16" value="B" onClick=Q16.value="**"> 略懂一点<br> <input type="radio" name="Q16" value="C" onClick=Q16.value="***"> 学过还算熟悉<br> <input type="radio" name="Q16" value="D" onClick=Q16.value="****"> 精通<br> </ol> 17.对图遍历、连通性、有向无环图的了解： <ol> <input type="radio" name="Q17" value="A" onClick=Q17.value="*"> 没学过<br> <input type="radio" name="Q17" value="B" onClick=Q17.value="**"> 略懂一点<br> <input type="radio" name="Q17" value="C" onClick=Q17.value="***"> 学过还算熟悉<br> <input type="radio" name="Q17" value="D" onClick=Q17.value="****"> 精通<br> </ol> 18.对动态存储管理的了解： <ol> <input type="radio" name="Q18" value="A" onClick=Q18.value="*"> 没学过<br> <input type="radio" name="Q18" value="B" onClick=Q18.value="**"> 略懂一点<br> <input type="radio" name="Q18" value="C" onClick=Q18.value="***"> 学过还算熟悉<br> <input type="radio" name="Q18" value="D" onClick=Q18.value="****"> 精通<br> </ol> 19.对哈希表、动态查找、静态查找的了解： <ol> <input type="radio" name="Q19" value="A" onClick=Q19.value="*"> 没学过<br> <input type="radio" name="Q19" value="B" onClick=Q19.value="**"> 略懂一点<br> <input type="radio" name="Q19" value="C" onClick=Q19.value="***"> 学过还算熟悉<br> <input type="radio" name="Q19" value="D" onClick=Q19.value="****"> 精通<br> </ol> 20.对下面算法中了解几种，递归、排序、二分查找、搜索、哈希算法、贪心算法、 分治算法、回溯算法、动态规划、字符串匹配算法： <ol> <input type="radio" name="Q20" value="A" onClick=Q20.value="*"> 了解0-2个<br> <input type="radio" name="Q20" value="B" onClick=Q20.value="**"> 了解3-5个<br> <input type="radio" name="Q20" value="C" onClick=Q20.value="***"> 了解5-8个<br> <input type="radio" name="Q20" value="D" onClick=Q20.value="****"> 全了解<br> </ol> <hr> <br> 你的考试成绩： <input name="SCORE" type="text" class="pt9" style="color: red;"> <input type="submit" id="submitBtn" style="display: none;"> <br><br> <input type="button" value="开始评分" onClick=scorequiz(this.form) class="pt9"> <input type="reset" name="reset" value="重新测试" onClick=clearquiz(this.form) class="pt9"> <input type="button" name="reset" value="给我推荐合适的学习图谱" class="pt9"> <br><br><br><br><br><br> </form> </body> </html>
最新回复(0)