JS实现类似网页的测试考卷

js实现table中获取不同td的值，并且md5加密，匹配md5的值（避免通过查看网页源代码可以看到正确答案），再用js前端判断输入与正确的值是否相同。最后再把错误的单词计数，并且输出，后端加入对应错误的数据库表中。

html代码片段：

{% for todayword1 in todayword1list%}








{% for todayword2 in todayword1.todayword2s%}







{%end%}

{%end%}

序号	中文		英文		序号	中文		英文
{{ todayword1.todayword1_id }}		{{ todayword1.todayword1_chinese }}				{{ todayword1.todayword1_english }}		查看	{{ todayword2.todayword2_id }}		{{ todayword2.todayword2_chinese }}				{{ todayword2.todayword2_english }}		查看

提交
重新测试

js代码：

var xmlhttp;
if (window.XMLHttpRequest){
xmlhttp=new XMLHttpRequest();
}
else{
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
function submit_word(){
var x = 0;//计算错误单词量
document.getElementById("submit_word").style.display = "none";
document.getElementById("retest_word").style.display = "";
var t = document.getElementById("tbody1");
for(var i=0;i<t.rows.length;i++){
t.rows[i].cells[3].style.display = "none";//奇数单词input
t.rows[i].cells[5].style.display = "";//填写的单词文本
t.rows[i].cells[6].style.display = "";//查看按钮
t.rows[i].cells[10].style.display = "none";//偶数单词input
t.rows[i].cells[12].style.display = "";//填写的单词文本
t.rows[i].cells[13].style.display = "";//查看按钮

var word_id1 = t.rows[i].cells[0].innerHTML;//奇数单词编号
var word_id2 = t.rows[i].cells[7].innerHTML;//偶数单词编号
var word_ip1 = t.rows[i].cells[3].getElementsByTagName("INPUT")[0].value;
var md5_wordip1 = hex_md5(word_ip1); //输入的奇数单词MD5加密
//alert(word_ip1); //奇数单词输入框
var word_english1 = t.rows[i].cells[4].innerHTML;//奇数单词英文值
//alert(word_english1); //偶数单词输入框
var word_ip2 = t.rows[i].cells[10].getElementsByTagName("INPUT")[0].value;
var md5_wordip2 = hex_md5(word_ip2); //输入的偶数单词MD5加密
//alert(word_ip2);
var word_english2 = t.rows[i].cells[11].innerHTML;//偶数单词英文值
//alert(word_english2); //偶数单词英文MD5加密
if(md5_wordip1word_english1 ){
return true;
}
else{
t.rows[i].cells[5].style = "text-decoration:line-through;color:red;";
xmlhttp.open("GET", "add_errorword_action?error_word"=word_id1, false);
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState4 && xmlhttp.status200)
{
x = x+1;
}
}
xmlhttp.send();
}
if(md5_wordip2word_english2 ){
return true;
}
else{
t.rows[i].cells[12].style = "text-decoration:line-through;color:red;";
xmlhttp.open("GET", "add_errorword_action?error_word"=word_id2, false);
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState4 && xmlhttp.status200)
{
x = x+1;
}
}
xmlhttp.send();
}
var y= t.rows.length*2-x;//计算正确的单词量
alert("共错误" + x + "个，正确" + y +"个单词");
document.getElementById("span_score").innerHTML = y;
}
}