JSON是一种轻量级的数据交换格式。便于人们读写，也便于机器分析和生成。JSON在前后交互中发挥了出色的作用。

服务器读取MYSQL数据，转换为JSON数据，传递给前端Javascript，对JSON数据进行操作。本文给出了一个例子来演示jQuery通过Ajax向PHP服务器发送请求并返回JSON数据。本文的读者应该具备jQuery、Ajax和PHP的知识，并且能够熟练使用。

可扩展的超文本标记语言

ul id=' user list ' lia href=' # ' rel=' 1 '张三/a/Li lia href=' # ' rel=' 2 ' Li si/a/Li lia href=' # ' rel=' 3 '王武/a/Li/ul div id=' info ' pname:span id。p性别：span id=' sex'/span/p电话：span id=' tel '/span/p pemail:span id=' email '/span/p/div在示例中，将显示用户名列表ul#userlist和用户详细信息层#info。值得注意的是，我为每个A标签设置了属性“rel”，并分配了一个值，这非常重要，将在jQuery中使用。我想达到的效果是，当我点击用户列表中任何一个用户的名字时，都会立即显示该用户的详细信息，比如电话、EMAIL等。

半铸钢钢性铸铁(Cast Semi-Steel)

# userlist { margin:4pxheight :42 px } # user list Li { float : left；宽度：80 px；线高：42 px；height:42pxfont-size :14 px；font-weight : bold } # info { clear : left；padding:6pxborder:1px实心# b6d6e6背景： # e8f 5fe } # info p { line-height :24 px } # info p span { font-weight : bold }

CSS设置用户列表和用户详细信息的显示外观，也可以自己设计一个好看的外观。

jQuery

在使用jQuery之前，不要忘记确保jQuery库已经加载。

脚本类型=' text/JavaScript ' src=' http :/js/jQuery . js '/脚本接下来开始编写jquery代码。

$(function(){ $('#userlist a '))。bind('click ')，function(){ var hol=$(this)。attr(' rel ')；var data=' action=getlinkid=' hol；$.getJSON('server.php '，数据，函数(json){ $('#name ')。html(JSON . name)；$('#sex ')。html(JSON . sex)；$('#tel ')。html(JSON . tel)；$('#email ')。html(JSON . email)；});});});我将一个点击事件绑定到用户列表中的每个A标签。当我单击用户名时，我会执行以下操作：获取当前标记的属性“rel”的值，并形成一个数据字符串：var data='action=getlinkid=' hol。然后我通过ajax向服务器server.php发送一个JSON请求。得到后台响应后，我返回JSON数据，并将得到的数据显示在用户详细信息中。

服务器端编程语言（Professional Hypertext Preprocessor的缩写）

得到前端Ajax请求后，后台server.php连接到数据库，通过传递的参数查询用户表，将对应的用户信息转换成array $list，最后将数组转换成JSON数据。关于PHP和JSON的操作，请查看本网站收集的文章：JSON在PHP中的应用。下面是server.php的详细代码，其中省略了数据连接。请设置您自己的数据连接。

include _ once(' connect . PHP ')；//连接数据库$ action=$ _ GET[action]；$ id=int val($ _ GET[id])；if($ action==' getlink '){ $ query=MySQL _ query(' select * from user，其中id=$ id ')；$ row=MySQL _ fetch _ array($ query)；$ list=array(' name '=$ row[username]，' sex'=$row[sex]，' tel'=$row[tel]，' email '=$ row[email])；echo JSON _ encode($ list)；}通过本文我们可以知道jQuery通过Ajax向服务器发送JSON请求，使用方法$.getJSON非常方便简单，而且服务器返回的数据可以解析得到对应字段的内容，相比HTML请求返回的大串字符串，处理起来方便快捷。最后，附上mysql表结构。

如果不存在则创建表`用户`(` id ' int(11)NOT NULL auto _ increment，` username ' varchar(100)NOT NULL，` sex ' varchar(6)NOT NULL，` tel ' varchar(50)NOT NULL，` email ' varchar(64)NOT NULL，PRIMARY KEY(` id `) ENGINE=MyISAM DEFAULT CHARSET=utf8；好了，本文的全部叙述就到此结束了，欲了解更多有关jquery ajax json方面的知识请登录我们(www.jb51.net)网站了解详情。