详谈JqueryAjax异步处理Json数据.详解.doc

详谈 Jquery Ajax异步处理Json数据. 啥叫异步,啥叫Ajax.咱不谈啥XMLHTTPRequest.通俗讲异步就是前台页面javascript能调用后台方法.这样就达到了无刷新. 所谓的Ajax.这里我们讲二种方法 方法一:(微软有自带Ajax框架) 在A里微软有自己的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, url: Default2.aspx/HelloWorld, //调用WebService的地址和方法名称组合 WsURL/方法名 data: {}, //这里是要传递的参数，格式为 data: {paraName:paraValue},下面将会看到 dataType: json, //WebService 会返回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(toString() + ); //alert(result.d.join( | )); }); } }); }); }); //返回复合类型 $(document).ready(function() {