多道单选题提交判分

最新推荐文章于 2020-04-04 23:37:48 发布

原创最新推荐文章于 2020-04-04 23:37:48 发布 · 371 阅读

0 ·

CC 4.0 BY-SA版权

小功能专栏收录该内容

5 篇文章

订阅专栏

本文介绍了一个简单的HTML在线测验系统实现方式，该系统通过预定义的答案数组与用户选择进行比对来评分。用户可以在浏览器中完成选择题，并点击按钮提交答案以获得分数。

<!DOCTYPE html>
<HTML>

<head>
<meta charset="UTF-8">
<style>
.div_bor {
border: 1px solid #274b8b;
padding: 5px 5px 10px 5px;
}
</style>
</head>

<body>
<div class="div_bor">
<p>这是题目</p>
<p><input type="radio" value="A" name="1"> A.选项1</p>
<p><input type="radio" value="B" name="1"> B.选项2</p>
<p><input type="radio" value="C" name="1"> C.选项3</p>
<p><input type="radio" value="D" name="1"> D.选项4</p>
<p><input type="radio" value="E" name="1"> E.选项5</p>
</div>
<div class="div_bor">
<p>这是题目</p>
<p><input type="radio" value="A" name="2"> A.选项1</p>
<p><input type="radio" value="B" name="2"> B.选项2</p>
<p><input type="radio" value="C" name="2"> C.选项3</p>
<p><input type="radio" value="D" name="2"> D.选项4</p>
<p><input type="radio" value="E" name="2"> E.选项5</p>

</div>
<p><button style="float: right" onclick="fn()">确定</button></p>
<script>
var result = ["A","C"];
var check = [];
var score = 0;
var rule = document.getElementsByTagName("input");

function fn() {
for(var i = 0; i < rule.length; i++) {
if(rule[i].checked) {
check.push(rule[i].value);
}
}
for(var m = 0; m < result.length; m++){
for(var j = 0; j < check.length; j++) {
if(result[m] == check[j]) {
score+=10;
}
}
}
alert(score + '分');
}
</script>
</body>

</html>