jQuery AJAX post json

<?php
header("Content-type: plain/text;charset=utf-8");
$data['id'] = 1;
$dat['name'] = "mary";
//$da['red']= array_merge($data,$dat);
$da[]= array_merge($data,$dat);
$data1['id'] = 2;
$dat1['name'] = "燕子";
//$da['blue']= array_merge($data1,$dat1);
$da[]= array_merge($data1,$dat1);
//print_r($da);///打印出来是一个二维数组(如下)
echo json_encode($da);//输出的是一个转化成json格式的字符串,可以直接在js中用(如下)
/////////////////////////////////////////////////////////////////////////////////////////
/////////////////////////////////////////////////////////////////////////////////////////
[{"id":1,"name":"mary"},{"id":2,"name":"\u71d5\u5b50"}]
*/
?>

  

D:\workspace\php\hellophp\ajax_javascript\jQuery_post2_json.php

<!DOCTYPE html>
<html>
<head>
 <title> jQuery_post2_json </title>
 <meta charset="UTF-8">
<script type="text/javascript" src="jQuery/jquery-1.11.1.min.js" ></script>
<script>
$(document).ready(function(){
  $("button").click(function(){

    $.ajax({ 
           type: "post", 
           url: "json_data.php", 
           dataType: "json", 
           success: function (data) { 
                  //[{"id":1,"name":"mary"},{"id":2,"name":"\u71d5\u5b50"}]      
                  var obj_array=eval(data);
                  var htmltext="";
                  for(i=0;i<obj_array.length;i++){
                      htmltext += "id: " + obj_array[i].id + " ; " +  "name: " + obj_array[i].name + "<br />";
                  }
                   $("#result").html(htmltext); 
                  }, 
            error: function (XMLHttpRequest, textStatus, errorThrown) { 
                             alert(errorThrown); 
                    }
    });

  });
});
</script>
</head>
<body>

<button>向页面发送 HTTP POST 请求,并解析返回的json</button>
<div id="result" >
    
</div>
</body>
</html>

 

posted @ 2017-11-08 10:51  sky20080101  阅读(133)  评论(0)    收藏  举报