php ajax+json筛选,php+jquery+ajax+json示例

客户端代码ajax_client.html

php+jquery+ajax+json示例

php+jquery+ajax+json示例

//添加文档

$(document).ready(

function(){

$("body").append('');

$('#btn').click(function (){ getServerData(); });

$("body").append('

}

);

//设置ajax的参数

function getServerData(){

$.ajax({

url:"ajax_server.php",

data:"name=周&sex=男&age=11",

timeout:3000,

type:"POST",

error:function (XMLHttpRequest, textStatus, errorThrown) {alert('请求错误...'+errorThrown);},

beforeSend:function (XMLHttpRequest) {alert('发送请求之前...');},

success: function (data, textStatus) {alert('请求成功...');},

complete:handleResponse

});

}

//成功返回的绑定函数

function handleResponse(XMLHttpRequest, textStatus) {

alert('完成啦...'+XMLHttpRequest);

var myjson = eval(XMLHttpRequest.responseText);

var str="";

for(var i=0;i

str+="姓名:"+myjson[i].name+"
";

str+="年龄:"+myjson[i].age+"
";

str+="性别:"+myjson[i].sex+"
";

}

$("#result").html(str);

$("#result").append('');

$('#btn2').click(function (){ $("#result").html(''); });

}

服务器端代码ajax_server.php

$data[]=array('name'=>'万','sex'=>'男','age'=>12);

$data[]=array('name'=>'陈','sex'=>'女','age'=>10);

$data[]=array('name'=>$_REQUEST['name'],'sex'=>$_REQUEST['sex'],'age'=>$_REQUEST['age']);

echo json_encode($data);

?>

还需要的是一个类库jquery-1.5.1.min.js,把这三个文件放到同一个文件夹即可。。

示例的图片：