码迷,mamicode.com
首页 > 其他好文 > 详细

jQuyer模拟在线考试做题

时间:2015-01-30 15:48:57      阅读:160      评论:0      收藏:0      [点我收藏+]

标签:jquery

<!DOCTYPE html>
<html><head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>在线考试</title>
<meta name="Keywords" content="">
<meta name="Description" content="">
<meta charset="utf-8">
<meta name="format-detection" content="telephone=no">	
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<script src="http://code.jquery.com/jquery-1.11.2.js" type="text/javascript"></script>

</head>

<body>
<input id="qid" type="hidden"/>
<div id="ques"></div>
<div id="ans"></div>
<br/>

</body></html>
<script>
	
	var qest_list = [{"qid":1,"ques":"第1题题目","ans":["a","b","c","d"],"right":"a"},{"qid":2,"ques":"第2题题目","ans":["a","b","c","d"],"right":"b"},{"qid":3,"ques":"第3题题目","ans":["a","b","c","d"],"right":"c"},{"qid":4,"ques":"第4题题目","ans":["a","b","c","d"],"right":"d"}];

	var idx = 0, score = 60;
	loadQues(idx);

	//根据数组下标取得问题信息
	function loadQues(idx){
		var qid = qest_list[idx].qid;
		var ans = qest_list[idx].ans;
		var right = qest_list[idx].right;
		var ques = qest_list[idx].ques;	
		$("#qid").val(qid);//问题id
		$("#ques").html(ques);
		var html = "";
		$(ans).each(function(){
			
			html += '<span style="cursor:pointer"><input onclick="chk()" name="ans" type="radio" value='+this+'><span onclick="clk(this)">'+this+'</span></span>';
		});
		//alert(html);
		$("#ans").html(html);
	}
	
	function clk(obj){
		var inp = $(obj).parent().find("input")[0];
		var ck = $(inp).prop("checked");
		if(ck==true){
			$(inp).prop("checked",false);
		}else{
			$(inp).prop("checked",true);
		}
		chk();
	}
	
	//判断是否正确
	function chk(){
		var rdoVal = $("input[type=radio]:checked").val();
		var qid = $("#qid").val();
		if(qest_list[idx].right==rdoVal){
			score --;
			alert('还差'+score+'分及格');
		}else{
			alert('正确答案是'+qest_list[idx].right);
		}
		
		//进入下一题
		if(idx < qest_list.length-1){
			idx ++;
			loadQues(idx);
		}
	}
</script>





jQuyer模拟在线考试做题

标签:jquery

原文地址:http://blog.csdn.net/jilongliang/article/details/43307585

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!