jq ajax json实例,jQuery基于ajax操作json数据简单示例

本文实例讲述了jQuery基于ajax操作json数据的方法。分享给大家供大家参考，具体如下：

jQuery Ajax 实例演示

jQuery Ajax 的三种格式，在与后台进行数据交互的时候可以是json格式也可以是xml格式，本人建议将数据转化成json格式。

Xml与json的比较

1、可读性

JSON和XML的可读性可谓不相上下，一边是建议的语法，一边是规范的标签形式，很难分出胜负。

2、可扩展性

XML天生有很好的扩展性，JSON当然也有，没有什么是XML能扩展，JSON不能的。

3、编码难度

XML有丰富的编码工具，比如Dom4j、JDom等，JSON也有json.org提供的工具，但是JSON的编码明显比XML容易许多，即使不借助工 具也能写出JSON的代码，可是要写好XML就不太容易了。

4、解码难度

XML的解析得考虑子节点父节点，让人头昏眼花，而JSON的解析难度几乎为0。这一点XML输的真是没话说。

jQuery Ajax 实例演示

$(document).ready(function ()

{

$('#send_ajax').click(function (){

var params=$('input').serialize(); //序列化表单的值

$.ajax({

url:'ajax_json.php', //后台处理程序

type:'post', //数据发送方式

dataType:'json', //接受数据格式

data:params, //要传递的数据

success:update_page //回传函数(这里是函数名)

});

});

//$.post()方式：

$('#test_post').click(function (){

$.post(

'ajax_json.php',

{

username:$('#input1').val(),

age:$('#input2').val(),

sex:$('#input3').val(),

job:$('#input4').val()

},

function (data) //回传函数

{

var myjson='';

eval('myjson=' + data + ';');

$('#result').html("姓名:" + myjson.username + "
工作:" + myjson['job']);

}

);

});

//$.get()方式：

$('#test_get').click(function ()

'ajax_json.php',

{

username:$("#input1").val(),

age:$("#input2").val(),

sex:$("#input3").val(),

job:$("#input4").val()

},

function(data) //回传函数

{

var myjson='';

eval("myjson=" + data + ";");

$("#result").html(myjson.job);

}

);

});

});

function update_page (json) //回传函数实体，参数为XMLhttpRequest.responseText

{

var str="姓名:"+json.username+"
";

str+="年龄:"+json.age+"
";

str+="性别:"+json.sex+"
";

str+="工作:"+json.job+"
";

str+="追加测试:"+json.append;

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

}

输入姓名:

输入年龄:

输入性别:

输入工作:

提交

POST提交

GET提交

PHP 文件 ajax_json.php：

//$arr = $_POST; //若以$.get()方式发送数据，则要改成$_GET.或者干脆:$_REQUEST

$arr = $_REQUEST;

$arr['append'] = '测试字符串';

//print_r($arr);

$myjson = my_json_encode($arr);

echo $myjson;

function my_json_encode($phparr)

{

if(function_exists("json_encode"))

{

return json_encode($phparr);

}

else

{

require_once 'json/json.class.php';

$json = new Services_JSON;

return $json->encode($phparr);

}

}

?>

PS：关于json操作，这里再为大家推荐几款比较实用的json在线工具供大家参考使用：

希望本文所述对大家jQuery程序设计有所帮助。