1 ------------------------------------------------------完整版----------------------------------------------------------------------------
$(document).ready(function () {
2 $(".dazhao").click(function(){
3 $("#fade").hide(200);
4 $(".white_content").hide(200);
5 $("#anwser1").show(300);
6 var hol=$(this).attr("id");
7 $.post("data.php", {"types":hol},function (data) {
8 var index = 0;//声明一个出题目数量的初始变量
9 $("#anwser1 #question").html("<p>" + (index + 1) + "." + data[index]["question"] + "</p>");
10 $.each(data[index]["answers"], function (i, item) {
11 var xuanze1 = $("#anwser1 #chose .xuanze1").eq(i);
12 xuanze1.html(" " + xuanze1.attr("id") + "." + item);
13 });
14 var result=0; //声明一个判断用户答案对错的初始变量
15 $(".xuanze1").click(function () {
16 if($(this).attr("id")==data[index]["correct"]){
17 result=++result;
18 }
19 // alert(result);
20 index=index+1;
21 if(index<3){
22 $("#anwser1 #question").html("<p>" + (index + 1) + "." + data[index]["question"] + "</p>");
23 $.each(data[index]["answers"], function (i, item) {
24 var xuanze1 = $("#anwser1 #chose .xuanze1").eq(i);
25 xuanze1.html(" " + xuanze1.attr("id") + "." + item);
26 });
27 //alert("正确答案为"+data[index]["correct"]+" 即将进入下一题");
28 }else{
29 $("#anwser1").hide();
30 $("#fenxiang").show();
31 $("body").css("background-image","url(images/bg_share.jpg)");
32 //根据用户选择的测试类别进行判断输出
33 switch(hol){
34 case'ad':hol='广告策划师';
35 break;
36 case'web':hol='WEB前端工程师';
37 break;
38 case'produce':hol='产品专员';
39 break;
40 case'ui':hol='UI设计师';
41 break;
42 case'php':hol='PHP工程师';
43 break;
44 case'java':hol='Java工程师';
45 break;
46 case'and':hol='Android工程师';
47 break;
48 }
49 //根据答对题目的个数分配比例
50 switch(result){
51 case 0:result='28%';
52 break;
53 case 1:result='58%';
54 break;
55 case 2:result='78%';
56 break;
57 case 3:result='93%';
58 break;
59 }
60 $("#fenxiang #p111").html(result);
61 $("#fenxiang #type111").html(hol);
62 }
63 });
64 }, "JSON");
65 });
66 });
67
1 <div id="anwser1" style="display:none">
2 <div id="question">
3 <p id="p1"></p>
4
5 </div>
6 <div id="chose">
7 <div id="A" class="xuanze1"></div>
8 <div id="B" class="xuanze1"></div>
9 <div id="C" class="xuanze1"></div>
10 </div>
11 </div>
$(document).ready(function () {
$(".dazhao").click(function(){
$("#fade").hide(200);
$(".white_content").hide(200);
$("#anwser1").show(300);
var hol=$(this).attr("id");
$.post("data.php", {"types":hol},function (data) {
var index = 0;
$("#anwser1 #question").html("<p>" + (index + 1) + "." + data[index]["question"] + "</p>");
$.each(data[index]["answers"], function (i, item) {
var xuanze1 = $("#anwser1 #chose .xuanze1").eq(i); //因为有3个xuanze1,eq(i)就是获取这个列表对象的第几个条目的对象了
xuanze1.html(" " + xuanze1.attr("id") + "." + item);
});
$(".xuanze1").click(function () {
// alert("正确答案为"+data[index]["correct"]+" 即将进入下一题");
index=index+1;
if(index<3){
$("#anwser1 #question").html("<p>" + (index + 1) + "." + data[index]["question"] + "</p>");
$.each(data[index]["answers"], function (i, item) {
var xuanze1 = $("#anwser1 #chose .xuanze1").eq(i);
xuanze1.html(" " + xuanze1.attr("id") + "." + item);
});
}else{
$("#anwser1").hide();
$("#fenxiang").show();
}
});
}, "JSON");
});
});
1 <?php
2 include_once("conn.php");
3 $types=$_POST['types'];
4 $sql="select distinct* from test01 where types='$types' order by rand() limit 0,3";
5 $query = mysql_query($sql,$conn);
6 while($row=mysql_fetch_array($query)){
7 $answers = explode('###',$row['answer']);
8 $arr[]= array(
9 'question' =>$row['question'],
10 'answers' => $answers,
11 'correct'=>$row['correct'],
12 );
13 }
14 $json=json_encode($arr);
15 echo $json;
16 ?>
