Jquery Ajax 异步处理Json数据
ajax--实现异步请求,接受响应及执行回调

参数类型说明url 为string(因此要⽤引号引起来)发送请求的地址type string请求的⽅式:post或get请求。
默认为get请求data Object或string发送服务器的数据,键值对,字符串或对象,这⾥post请求有此参数,get请求直接在地址处?后⾯传参即可dataTypestring后端返回给前端的数据类型,⽐如html,xml,json。
本来是string,在ajax请求时设置dataType为json,将字符串;类型变为json类型succ ess function请求成功后调⽤的回调函数,需要操作的东西⼀般在这⾥写⽤法success:function(e 这个字母e可以是其他英⽂){写内容} 注意这个()⾥⾯的e或者说其他东西就是后端HttpResponse或者JsonResponse返回的东西,这⾥与dataType有关error function请求失败时调⽤的回调函数asyn c Boolean是否异步处理,默认为True,false为同步处理ajax--实现异步请求,接受响应及执⾏回调ajax最⼤的优点是在不重新加载整个页⾯的情况下,可以与服务器交换数据并更新部分⽹页的内容ajax指是⼀种创建交互式⽹页应⽤的⽹页开发技术,其实就是实现前后端交互。
1)ajax是异步javascript,异步的意思即⾮阻塞,就像线程,在代码运⾏到ajax请求时,它会分成两条线,⼀条线去运⾏ajax请求⾥⾯的内容,另⼀条线去运⾏主程序(即ajax请求后⾯的代码),当然我们可以因需要异步设置成同步(即在运⾏到ajax请求时,将阻塞运⾏完ajax请求后,再去运⾏ajax外,后⾯的代码)2)注意ajax请求是由jquery发起的,因此⽤于jquery代码块中。
3)执⾏相应的视图函数(这⾥是在⼀个py,php等⽂件中创建⼀个视图函数,或者class类,给这个视图函数分级设置⼀个url地址,ajax请求中的url即填写这个完整的url地址),返回json内容。
jq解析json的高级用法

jq解析json的高级用法jq是一个轻量级的命令行工具,用于解析和操作JSON数据。
它提供了丰富的功能和高级用法,可以帮助用户更精确地提取和处理JSON数据。
本文将介绍jq解析JSON的高级用法,包括过滤、映射和条件操作等。
第一步:基本用法回顾在开始讨论jq的高级用法之前,我们先回顾一下jq的基本用法。
jq能够将JSON数据转换为人类可读的格式,并且能够输出特定的字段或组合字段的值。
以下是一些常用的命令:1. `.`这个点操作符表示当前对象。
例如:bashecho '{"name": "Alice", "age": 30}' jq '.name'# 输出:"Alice"2. .点操作符还可以与其他命令连用,以获取嵌套字段的值。
例如:bashecho '{"user": {"name": "Alice", "age": 30}}' jq ''# 输出:"Alice"3. `[]`这个方括号操作符可以用来遍历数组,并逐个输出数组中的元素。
例如:bashecho '[1, 2, 3, 4, 5]' jq '.[]'# 输出:# 1# 2# 3# 4# 5以上是jq的基本用法,用于提取和处理JSON数据中的字段。
接下来,我们将学习一些更高级的用法。
第二步:高级过滤器jq支持一些高级过滤器,用于在JSON数据中进行更复杂的查询和操作。
下面是几个常见的高级过滤器:1. `select()``select()`函数用于根据指定的条件过滤JSON对象。
例如:bashecho '[{"name": "Alice", "age": 30}, {"name": "Bob", "age": 25}]' jq 'select(.age > 28)'# 输出:# {"name": "Alice", "age": 30}2. `map()``map()`函数用于对数组中的每个元素应用指定的操作,并返回一个新的数组。
jQuery调用AJAX异步操作超清晰教程

JQUERY AJAX异步操作详细说明AJAX 全称 Asynchronous JavaScript and XML(异步的 JavaScript 和XML)。
它并非一种新的技术,而是以下几种原有技术的结合体。
1)使用CSS和XHTML来表示。
2)使用DOM模型来交互和动态显示。
3)使用XMLHttpRequest来和服务器进行异步通信。
4)使用javascript来绑定和调用。
通过AJAX异步技术,可以在客户端脚本与web服务器交互数据的过程中使用XMLHttpRequest对象来完成HTTP请求(Request)/应答(Response)模型:1)不需要用户等待服务端响应。
在异步派发XMLHttpRequest请求后控制权马上就被返回到浏览器。
界面不会出现白板,在得到服务器响应之前还可以友好的给出一个加载提示。
2)不需要重新加载整个页面。
为XMLHttpRequest注册一个回调函数,待服务器响应到达时,触发回调函数,并且传递所需的少量数据。
“按需取数据”也降低了服务器的压力。
3)不需要使用隐藏或内嵌的框架。
在XHR对象之前,模拟Ajax通信通常使用hack手段,如使用隐藏的或内嵌的框架(<iframe>标签)。
下面介绍下AJAX中的重要对象:XMLHttpRequest。
XMLHttpRequest对象(XHR)XMLHttpRequest是一套可以在Javascript、VbScript、Jscript等脚本语言中通过http协议传送或接收XML及其他数据的一套API。
XMLHttpRequest对象首次以ActiveX对象形式在微软Internet Explorer(IE) 5中以引入。
其他浏览器制造商在认识到这一对象重要性后也纷纷实现了XMLHttpRequest对象,但是以一个本地JavaScript对象而不是作为一个ActiveX 对象实现。
而如今,由于安全性、标准等问题,微软已经在其IE 7中把XMLHttpRequest实现为一个本地JavaScript对象。
jquery解析json格式数据的方法(对象、字符串)

jquery解析json格式数据的⽅法(对象、字符串)本⽂实例讲述了jquery解析json格式数据的⽅法。
分享给⼤家供⼤家参考,具体如下:json数据是我们常⽤的⼀种⼩型的数据实时交换的⼀个东西,他可以利⽤jquery或js进⾏解析,下⾯我来介绍jquery解析json字符串⽅法。
⼀、jQuery解析Json数据格式:使⽤这种⽅法,你必须在Ajax请求中设置参数:dataType: "json"获取通过回调函数返回的数据并解析得到我们想要的值,看源码:jQuery.ajax({url: full_url,dataType: "json",success: function(results) {alert();} });通常情况下,你可以从后台返回JSON数据,前台就交给jQuery啦,哈哈!!jquery异步请求将type(⼀般为这个配置属性)设为“json”,或者利⽤$.getJSON()⽅法获得服务器返回,那么就不需要eval()⽅法了,因为这时候得到的结果已经是json对象了,只需直接调⽤该对象即可,这⾥以$.getJSON⽅法为例例1代码如下:var data="{root:[{name:'1',value:'0'},{name:'6101',value:'北京市'},{name:'6102',value:'天津市'},{name:'6103',value:'上海市'},{name:'6104',value:'重庆市'},{name:'6105',value:'渭南市'},{name:'6106',value:'延安市'},{name:'6107',value:'汉中市'},{name:'6108',value:'榆林市'},{name:'6109',value:'安康市'},{name:'6110',value:'商洛市'}]}";jquery$.getJSON("https:///",{param:"sanic"},function(data){//此处返回的data已经是json对象//以下其他操作同第⼀种情况$.each(data.root,function(idx,item){if(idx==0){return true;//同countinue,返回false同break}alert("name:"++",value:"+item.value);});});⼆、jQuery解析Json对象:jQuery提供了另⼀种⽅法“parseJSON”,这需要⼀个标准的JSON字符串,并返回⽣成的JavaScript对象。
jQuery使用ajax传递json对象到服务端及contentType的用法示例

jQuery使⽤ajax传递json对象到服务端及contentType的⽤法⽰例⽬录0、⼀般情况下,通过键值对的⽅式将参数传递到服务端0.1 客户端代码:0.2 服务端代码:0.3 在浏览器的⽹络中查看此次请求:1、ajax 传递复杂json对象到服务端1.1 ⽅法⼀:通过formdata传值,服务端通过key获取值;1.2 ⽅法⼆:通过formdata⽅式传值,服务端读取Request.InputStream;2、content-Type 对 mvc项⽬的重要性2.1 客户端代码:2.2 服务端代码:2.3 解决⽅案:(设置contentType)2.4 其他的解决⽅案:(修改服务端代码)本⽂实例讲述了jQuery使⽤ajax传递json对象到服务端及contentType的⽤法。
分享给⼤家供⼤家参考,具体如下:0、⼀般情况下,通过键值对的⽅式将参数传递到服务端0.1 客户端代码:$.ajax({url: 'TestHandler.ashx',type: 'post',data: {name: "admin",age: 10},dataType: 'text',success: function (data) {alert(data);}})0.2 服务端代码:public void ProcessRequest(HttpContext context){string bodyText = string.Empty;using (var bodyReader = new System.IO.StreamReader(context.Request.InputStream)){bodyText = bodyReader.ReadToEnd();}string name= context.Request["name"].ToString();// "admin"string age = context.Request["age"].ToString();// "10"context.Response.ContentType = "text/plain";context.Response.Write(bodyText);// "name=admin&age=10"}0.3 在浏览器的⽹络中查看此次请求:从上⾯的截图中可以看出,post请求,是将formdata中键值对⽤符号“&”相连,拼接成⼀个字符串,传递到服务端,服务端可以通过key来获取值,或从request的body中读取整个字符串;1、ajax 传递复杂json对象到服务端1.1 ⽅法⼀:通过formdata传值,服务端通过key获取值;客户端代码:var user1 = {username: 'admin',age: 10};var user2 = {username: 'test',age: 11};var userArr = [];userArr.push(user1);userArr.push(user2);$.ajax({url: 'TestHandler.ashx',type: 'post',//contentType: 'application/json',//contentType:"application/x-www-form-urlencoded; charset=UTF-8",data: {Users: JSON.stringify(userArr)},dataType: 'text',success: function (data) {alert(data);}})服务端代码:public void ProcessRequest(HttpContext context){string contentType= context.Request.ContentType;// "application/x-www-form-urlencoded; charset=UTF-8"string users = context.Request["Users"].ToString();dynamic obj = JsonConvert.DeserializeObject(users);context.Response.ContentType = "text/plain";context.Response.Write(obj[0].username);// "admin"}1.2 ⽅法⼆:通过formdata⽅式传值,服务端读取Request.InputStream;前端代码:var user1 = { username: 'admin', age: 10 };var user2 = { username: 'test', age: 11 };var userArr = [];userArr.push(user1);userArr.push(user2);$.ajax({url: 'TestHandler.ashx',type: 'post',//contentType: 'application/json',//contentType:"application/x-www-form-urlencoded; charset=UTF-8",data: JSON.stringify(userArr),dataType: 'text',success: function (data) {alert(data);}})服务端代码:public void ProcessRequest(HttpContext context){string contentType= context.Request.ContentType;//"application/x-www-form-urlencoded; charset=UTF-8"string bodyText = string.Empty;using (var bodyReader = new System.IO.StreamReader(context.Request.InputStream)){bodyText = bodyReader.ReadToEnd();// [{"username":"admin","age":10},{"username":"test","age":11}]}dynamic obj = JsonConvert.DeserializeObject(bodyText);context.Response.ContentType = "text/plain";context.Response.Write(obj[0].username);// "admin"}通过浏览器查看此次请求:从图中可以看出,content-Type 为application/x-www-form-urlencoded,所以浏览器尝试将传输的数据解析成key-value的形式,但实际在ajax中的data中设置的是⼀个json字符串,⽆法解析成key-value的形式,故在服务端⽆法通过key来获取值;只能从Request.InputStream获取。
jqueryajaxthinkphp异步局部刷新完整流程

jqueryajaxthinkphp异步局部刷新完整流程环境:ThinkPHP3.2.3,jQuery3.2前⾔:在⼀般的⽹站中,都需要⽤到jquery或者其他框架(⽐如angular)来处理前后端数据交互,thinkphp在后台也内置了⼀些函数⽤于数据交互(⽐如ajaxReturn())。
本⽂的⽬的是打通使⽤ajax在jquery和thinkphp之间的前后端数据交互过程。
正⽂:⼀、thinkphp关于ajax的介绍1.1 ajaxReturn:\Think\Controller类提供了ajaxReturn⽅法⽤于AJAX返回数据给客户端(视图、模板、js等)。
并且⽀持JSON、JSONP、XML和EVAL四种⽅式给客户端接受数据(默认JSON)。
(链接:)配置⽅式:convention.php中定义了默认编码类型为DEFAULT_AJAX_RETURN => 'JSON',分析:ajaxReturn()调⽤了json_encode()将数值转换成json数据存储格式,常⽤的数值是数组。
注意:The value being encoded can be any type except a resource(资源⽂件).All string data must be UTF-8 encoded.(链接:)举例:$data['status'] = 1;$data['content'] = 'content';$this->ajaxReturn($data);1.2 请求类型:系统内置了⼀些常量⽤于判断请求类型,⽐如:常量说明IS_GET 判断是否是GET⽅式提交IS_POST 判断是否是POST⽅式提交IS_PUT 判断是否是PUT⽅式提交IS_DELETE 判断是否是DELETE⽅式提交IS_AJAX 判断是否是AJAX提交REQUEST_METHOD 当前提交类型⽬的:⼀⽅⾯可以针对请求类型作出不同的逻辑处理,另外⼀⽅⾯可以过滤不安全的请求。
jQuery操作Ajax和Json

jQuery操作Ajax和Json嗯,自己学SSH和做项目也已有两个月了。
自己今天来整理一下自己在项目中利用jQuery操作过的Ajax和Json。
当时我对于jQuery操作Ajax几乎不怎么了解,但是项目中有需求,所以自己也是必须要去使用,因此现在来详细讲解一下自己在项目中的操作。
功能中,有一个下拉框,里面存储的是服务商的信息,首选项是“--请选择--”,当我选择第一个下拉框中服务商信息之后,后面紧接着将会得到这个选定的服务商下的所有产品。
做一个联动操作。
虽然我不会用jQuery操作Ajax,但是我第一反应就是想到利用这块技术,于是自己就开始查找对应的资料了。
首先,我在Action中,将服务商的信息从数据库查找出来,保存到List集合中,将集合转发到JSP界面上,利用的是struts2标签:<div><s:select name="provider.iscenicid"list="#request.providerList"listKey="i scenicid"listValue="szcenicname"headerKey=""headerValue="--请选择"onchange="onChangeOptionScenic(this)"id="scenicType"/></s:select><span id="productInfo"></span></div>(ps:其实这个里面,本不应该设置headerKey和headerValue,应该在Action中在List集合中去增加一行再进行操作。
)中间的span标签就是将要利用jQuery操作Ajax把产品信息增加到span标签里面!其次,进行jQuery操作Ajax了:<script>function onChangeOptionScenic(_this) {// 获取下拉框中的listKey值var iscenic =$(_this).val();// 设置一个变量,来进行下面的操作var htmltv ="";// 设置URL地址var url ="/tips/travelmessage.action";// Ajax操作开始$.ajax ({// 设定URLurl : url,// 设置提交方式,这里为posttype : "post",// 设置数据类型为JsondataType : "json",// 设置传过去的值的属性名data : {"iscenicid" : iscenic},// 成功返回之后的操作方法success : function(result) {// 获取Action中传回来的result的值var json =eval("("+result+")");// 循环将服务商下的产品以复选框形式拼接出来for(var i=0; i<json.length; i++) {// 将产品信息以复选框形式拼接起来htmltv +="<input type='checkbox' name='productNa me'value='"+json[i].productId+"'/>"+json[i].prod uctName;}// 添加到上面的span标签中$("#productInfo").val(htmltv);}});}</script>最后,将result进行一个映射文件的配置,配置信息如下(根据公司的一些设定而操作):<action name="travelmessage"class="com.web.system.tips.TravelMessageAction" method="trav elMessage"><result type="json"><param name="root">result</param></result></action>在TravelMessageAction中,需要将内容返回到result中,部分代码如下:List productList = travelMessageService.getProductInfo(product);JSONArray json =new JSONArray().fromObject(productList);result = json.toString();return SUCCESS;至此,一个完整的操作已完成,这就是自己的一点点整理,希望以后有更多的有技术的知识与大家分享!。
ajax传值,jQuery.ajax,json格式转化和前台后台传值

1.ajax传输用字符串,后台接收参数用request.getParameter,所以前台必须有Parameter 如"/FirstServlet/regPage?countryId=" + countryId2.后台向前台传参数通过response,PrintWriter pw = resp.getWriter();pw.print(“df”);前台接收参数用var txt = xhr.responseText;3.如果用json字符串传输前台用jQuery.ajax是如下data : {'mydata':jsonStr},jQuery.ajax({type: "post",url: url,dataType : 'json',data : {'mydata':jsonStr},success: function(data,textStatus){alert("操作成功");},error: function(xhr,status,errMsg){alert("操作失败!");}});后台一样用request如String jsonStr = ServletActionContext.getRequest().getParameter("mydata");4.后台向前台传值一样用response如pw.print(jsonList.toString());前台接收jQuery用success: function(data,textStatus)data就是一个json(自动将json字符串转化为了json)5.json与json字符串之间的转化json的格式两种:数组["hello", 12, true , null];和对象{ "color": "red", "doors" : 4, "paidFor" : true };前台:json-json字符串JSON.stringify(jsonobj);$("#form").serialize()//表单转化为json字符串json字符串-jsoneval('(' + jsonstr + ')');JSON.parse(jsonstr);使用Function对象来进行返回解析function(data,textStatus){后台:json-json字符串jsonObj.toString()json字符串-jsonJSONObject obj1 = JSONObject.fromObject("{'dsaf':'uuuu'}");JSONObject obj = JSONObject.fromObject(address);//把对象转化为json。
- 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益,请联系客服反馈,我们会尽快为您处理(人工客服工作时间:9:00-18:30)。
啥叫异步,啥叫Ajax.咱不谈啥XMLHTTPRequest.通俗讲异步就是前台页面javascript能调用后台方法.这样就达到了无刷新.所谓的Ajax.这里我们讲二种方法方法一:(微软有自带Ajax框架)在里微软有自己的Ajax框架.就是在页面后台.cs文件里引入 using System.Web.Services 空间然后定义静态方法(方法前加上 [WebMethod])[WebMethod]public static string ABC(string ABC){return ABC;}好了,现在我们谈谈前台Js怎么处理后台返回的数据吧,可利用Jquery处理返回的纯html,json,Xml等数据.这里我们演示返回返回的数据有string、集合(List<>)、类.但都返回Json格式(Json轻量级比XML处理起来简单).看看前台是怎么解析这些数据的.代码如下:前台页面:<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs"Inherits="Default2" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="/1999/xhtml"><head runat="server"><title>无标题页</title><style type="text/css">.hover{cursor: pointer; /*小手*/background: #ffc; /*背景*/}</style><script type="text/javascript" src="js/jquery-1.3.2-vsdoc2.js"></script><script type="text/javascript">//无参数调用$(document).ready(function() {$('#btn1').click(function() {$.ajax({type: "POST", //访问WebService使用Post方式请求contentType: "application/json", //WebService 会返回Json类型url: "Default2.aspx/HelloWorld", //调用WebService的地址和方法名称组合 ---- WsURL/方法名data: "{}", //这里是要传递的参数,格式为 data: "{paraName:paraValue}",下面将会看到dataType: 'json',success: function(result) { //回调函数,result,返回值alert(result.d);}});});});//有参数调用$(document).ready(function() {$("#btn2").click(function() {$.ajax({type: "POST",contentType: "application/json",url: "Default2.aspx/GetWish",data: "{value1:'心想事成',value2:'万事如意',value3:'牛牛牛',value4:2009}", dataType: 'json',success: function(result) {alert(result.d);}});});});//返回集合(引用自网络,很说明问题)$(document).ready(function() {$("#btn3").click(function() {$.ajax({type: "POST",contentType: "application/json",url: "Default2.aspx/GetArray",data: "{i:10}",dataType: 'json',success: function(result) {$(result.d).each(function() {alert(this);$('#dictionary').append(this.toString() + " ");//alert(result.d.join(" | "));});}});});});//返回复合类型$(document).ready(function() {$('#btn4').click(function() {$.ajax({type: "POST",contentType: "application/json",url: "Default2.aspx/GetClass",data: "{}",dataType: 'json',success: function(result) {$(result.d).each(function() {//alert(this);$('#dictionary').append(this['ID'] + " " + this['Value']);//alert(result.d.join(" | "));});}});});});//Ajax 为用户提供反馈,他们两个方法可以添加给jQuery对象在Ajax前后回调//但对与Ajax的监控,本身是全局性的$(document).ready(function() {$('#loading').ajaxStart(function() {$(this).show();}).ajaxStop(function() {$(this).hide();});});// 鼠标移入移出效果,多个元素的时候,可以使用“,”隔开$(document).ready(function() {$('btn').hover(function() {$(this).addClass('hover');}, function() {$(this).removeClass('hover');});});</script></head><body><form id="form1" runat="server"><div><input type="button" id="btn1" value="HelloWorld"/><input type="button" id="btn2" value="传入参数"/><input type="button" id="btn3" value="返回集合"/><input type="button" id="btn4" value=" 返回复合类型"/></div><div id="dictionary">dictionary</div></form></body></html>后台.cs文件using System;using System.Collections;using System.Collections.Generic;using System.Configuration;using System.Data;using System.Linq;using System.Web;using System.Web.Security;using System.Web.UI;using System.Web.UI.HtmlControls;using System.Web.UI.WebControls;using System.Web.UI.WebControls.WebParts;using System.Web.Services;public partial class Default2 : System.Web.UI.Page{protected void Page_Load(object sender, EventArgs e){}[WebMethod]public static string HelloWorld(){return "123--->456";}[WebMethod]public static string ABC(string ABC){return ABC;}[WebMethod]public static string GetWish(string value1, string value2, string value3, int value4) {return string.Format("祝您在{3}年里 {0}、{1}、{2}", value1, value2, value3, value4); }/// <summary>/// 返回集合/// </summary>/// <param name="i"></param>/// <returns></returns>[WebMethod]public static List<int> GetArray(int i){List<int> list = new List<int>();while (i >= 0){list.Add(i--);}return list;}/// <summary>/// 返回一个复合类型/// </summary>/// <returns></returns>[WebMethod]public static Class1 GetClass(){return new Class1 { ID = "1", Value = "牛年大吉" };}public class Class1{public string ID { get; set; }public string Value { get; set; }}}利用Jquery让返回的各类数据(string、集合(List<>)、类)以Json数据格式返回,为什么要用到result.d 这里我们顺带讲下JsonJson简单讲就是Javascript对象或数组.Json形式一: javascript对象 { "firstName": "Brett", "lastName":"McLaughlin", "email": "aaaa" }Json形式二: javascript数组 [{ "firstName": "Brett", "lastName":"McLaughlin", "email": "aaaa" },{ "firstName": "Jason", "lastName":"Hunterwang", "email": "bbbb"}]当然javascript 数组和对象可以互相嵌套.如形式一中的"Brett"可以换成一个Js数组或Js对象.那微软的Ajax返回的是哪种形式呢.是第一种.微软框架默认返回一个 { "d": "后台返回的数据" } 这里我们用以上示例中的测试到得比如如上例的返回的是string类型的话Firefox调试如下当返回的是List<>类型的话FireFox调试如下返回的数据也是放在Js对象中的d属性里面所以说这就是为什么我们老是用result.d来取微软的框架返回的数据.方法一不常用.一般用得多的还是方法二.方法二:(建一个一般处理程序即.ashx文件)用这种方法一般是我们要在ashx文件里手动写好返回的Json格式的数据返回给前台用ashx 你可以配成Json格式一或Json格式二Default.aspx页面Js代码如下$.ajax({type: "POST",url: "Handler.ashx",dataType: "json",success: function(data){alert(); //返回的为 Json格式一(Js对象)/* 返回的为 Json格式二(Js对象)$(data).each(function(i) {alert(data[i].name);});*/}});Handler.ashx 代码如下<%@ WebHandler Language="C#" Class="Handler" %>using System;using System.Web;using System.Collections;using System.Collections.Generic;using System.Web.Script.Serialization;public class Handler : IHttpHandler {public void ProcessRequest (HttpContext context) {JavaScriptSerializer jss = new JavaScriptSerializer();context.Response.ContentType = "text/plain";// 返回的为Json格式一 Js对象string data = "{\"name\":\"wang\",\"age\":25}";// 返回的为Json格式二 Js数组//string data = "[{\"name\":\"wang\",\"age\":25},{\"name\":\"zhang\",\"age\":22}]"; context.Response.Write(data);}public bool IsReusable {get {return false;}}}以上基本上就第二种方法,可能有人不喜欢拼字符串.那有什么好办法呢?答案是有.微软对Json有很好的支持.拿上例子说我们只要把Handler.ashx改一下就可以了Handler.ashx 代码如下<%@ WebHandler Language="C#" Class="Handler" %>using System;using System.Web;using System.Collections;using System.Collections.Generic; // Dictionary<,> 键值对集合所需using System.Web.Script.Serialization; //JavaScriptSerializer 类所需public class Handler : IHttpHandler {public void ProcessRequest (HttpContext context) {JavaScriptSerializer jss = new JavaScriptSerializer();context.Response.ContentType = "text/plain";Dictionary<string, string> drow = new Dictionary<string, string>();drow.Add("name", "Wang");drow.Add("age", "24");context.Response.Write(jss.Serialize(drow));}public bool IsReusable {get {return false;}}}中的JavaScriptSerializer为我们提供了很好的方法jss.Serialize(drow) 是把drow的Dictionary<string, int> (键和值的集合)数据类型转换成Json数据格式调试结果如下图 (上面例子是输出了一个键值多集合即一个Json形式一的Js对象)如果要输出Json形式二(Js数组)呢? 我们也只要改动一部分就了Handler.ashx 代码如下<%@ WebHandler Language="C#" Class="Handler" %>using System;using System.Web;using System.Collections;using System.Collections.Generic;using System.Web.Script.Serialization;public class Handler : IHttpHandler {public void ProcessRequest (HttpContext context) {JavaScriptSerializer jss = new JavaScriptSerializer();context.Response.ContentType = "text/plain";List<Dictionary<string, string>> _list = new List<Dictionary<string, string>>();Dictionary<string, string> drow = new Dictionary<string, string>();drow.Add("name", "Wang");drow.Add("age", "24");Dictionary<string, string> drow1 = new Dictionary<string, string>();drow1.Add("name", "Zhang");drow1.Add("age", "35");_list.Add(drow);_list.Add(drow1);context.Response.Write(jss.Serialize(_list));}public bool IsReusable {get {return false;}}}调试结果如下图 (上面例子是输出了Json形式二的Js数组)讲到这里基本概念也讲得差不多了. 这里再讲一个够常碰到的例子就是如何把DataTabel转换成Json格式从而好让前台页面调用.就是在Handler.ashx写上一个方法/// <summary>/// DataTable转Json/// </summary>/// <param name="dtb"></param>/// <returns></returns>private string Dtb2Json(DataTable dtb){JavaScriptSerializer jss = new JavaScriptSerializer();ArrayList dic = new ArrayList();foreach (DataRow row in dtb.Rows){Dictionary<string, object> drow = new Dictionary<string, object>(); foreach (DataColumn col in dtb.Columns){drow.Add(col.ColumnName, row[col.ColumnName]);}dic.Add(drow);}return jss.Serialize(dic);}其实也有把Json格式转换成DataTabel格式,方法如下/// <summary>/// Json转DataTable/// </summary>/// <param name="json"></param>/// <returns></returns>private DataTable Json2Dtb(string json){JavaScriptSerializer jss = new JavaScriptSerializer();ArrayList dic = jss.Deserialize<ArrayList>(json);DataTable dtb = new DataTable();if (dic.Count > 0){foreach (Dictionary<string, object> drow in dic){if (dtb.Columns.Count == 0){foreach (string key in drow.Keys){dtb.Columns.Add(key, drow[key].GetType());}}DataRow row = dtb.NewRow();foreach (string key in drow.Keys){row[key] = drow[key];}dtb.Rows.Add(row);}}return dtb;}我们让返回的Json以表格的形式显示出来那么前台页面JS如下$.ajax({type: "POST",url: "Handler.ashx",dataType: "json",success: function(data){var table = $("<table border='1'></table>");for (var i = 0; i < data.length; i++) {o1 = data[i];var row = $("<tr></tr>");for (key in o1){var td = $("<td></td>");td.text(o1[key].toString());td.appendTo(row);}row.appendTo(table);}table.appendTo($("#back"));}});由上例子再讲两个Js知识点1. 之前我们取Json里面的数据如果是返回的是数组的话是用data[i].name也可表示为data[i]["name"]2. 如果要访问Js对象的说所有属性那么遍历Js对象.success: function(data){$(data).each(function(i) {for(key in this) // 遍历Js对象的所有属性alert(data[i][key]);//这里就不能换成 data[i].key 否则key成了属性而不是上面的key变量});}也有把前台Json数据传到后台后解析成DataTabel这里我把DataTabel软成Json和Json转成DataTabel写成一个例子.下载地址如下。