Jquery,ajax返回json数据后呈现到html页面的$.post方式。

     ------------------------------------------------------完整版----------------------------------------------------------------------------
                        $(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);
                             xuanze1.html("&nbsp;" + xuanze1.attr("id") + "." + item);
                     });
                      var result=0; //声明一个判断用户答案对错的初始变量
                      $(".xuanze1").click(function () {
                              if($(this).attr("id")==data[index]["correct"]){
                                      result=++result;
                                   }
                          // alert(result);
                             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("&nbsp;" + xuanze1.attr("id") + "." + item);
                         });
                         //alert("正确答案为"+data[index]["correct"]+"   即将进入下一题");
                       }else{
                                 $("#anwser1").hide();
                               $("#fenxiang").show();
                               $("body").css("background-image","url(images/bg_share.jpg)");
                               //根据用户选择的测试类别进行判断输出
                               switch(hol){
                                       case'ad':hol='广告策划师';
                                       break;
                                       case'web':hol='WEB前端工程师';
                                       break;
                                       case'produce':hol='产品专员';
                                       break;
                                       case'ui':hol='UI设计师';
                                       break;
                                       case'php':hol='PHP工程师';
                                       break;
                                       case'java':hol='Java工程师';
                                       break;
                                       case'and':hol='Android工程师';
                                       break;
                               }
                               //根据答对题目的个数分配比例
                               switch(result){
                                      case 0:result='28%';
                                      break;
                                      case 1:result='58%';
                                      break;
                                      case 2:result='78%';
                                      break;
                                      case 3:result='93%';
                                      break;
                               }
                               $("#fenxiang #p111").html(result);
                               $("#fenxiang #type111").html(hol);
                       }
                     });
                 }, "JSON");
             });
 });
   

 <div id="anwser1" style="display:none">
   <div id="question">
         <p id="p1"></p>

   </div>
   <div id="chose">
     <div id="A" class="xuanze1"></div>
     <div id="B" class="xuanze1"></div>
     <div id="C" class="xuanze1"></div>
   </div>
 </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("&nbsp;" + 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("&nbsp;" + xuanze1.attr("id") + "." + item);
                        });
                      }else{
                            $("#anwser1").hide();
                          $("#fenxiang").show();
                      }
                    });
                }, "JSON");
            });
});

 <?php
 include_once("conn.php");
 $types=$_POST['types'];
 $sql="select  distinct* from test01 where types='$types' order by rand() limit 0,3";
 $query = mysql_query($sql,$conn);
  while($row=mysql_fetch_array($query)){
     $answers = explode('###',$row['answer']);
     $arr[]= array(
         'question' =>$row['question'],
         'answers' => $answers,
         'correct'=>$row['correct'],
     );
 }
  $json=json_encode($arr);
  echo  $json;
 ?>