使用$.ajax实现获取后台数据，后台返回数据格式为text，json，xml三种类型

$.ajax()

定义：ajax()方法通过远程HTTP请求载入信息 

语法：Jquery.ajax([settings])

常用参数[settings]--用于配置Ajax的键值对请求

url：必须，请求发送的地址

type: 请求方式

data：可选，发送到服务器的数据

success：可选，请求成功时运行的函数

1).data：包含结果的数据

2).status:包含请求的状态

3).jqXHR:包含XmlHttpRequest对象

dataType：服务器响应的数据类型，默认将智能判断

其余参数详情参见：http://www.w3school.com.cn/jquery/ajax_ajax.asp

1>.test格式 --获取时间的时，分，秒

后台代码：

 
  
  1. public partial class textData : System.Web.UI.Page  
  2.    {  
  3. protectedvoid Page_Load(object sender, EventArgs e)  
  4.        {  
  5.            string hour = DateTime.Now.Hour.ToString();  
  6.            string minute = DateTime.Now.Minute.ToString();  
  7.            string second = DateTime.Now.Second.ToString();  
  8.            string textStr = hour + "/" + minute + "/" + second;  
  9.            Response.Write(textStr);  
  10.            Response.End();  
  11.        }  
  12.    } 
 
  
前台获取代码：
 
  
 
  
  1. <script src="../Scripts/jquery-1.8.0.js" type="text/javascript"></script>  
  2. <script type="text/javascript">  
  3.     $(function () {  
  4.         $("#btnText").click(function () {  
  5.             $.ajax({  
  6.                 url: "textData.aspx",  
  7.                 type: "get",  
  8.                 dataType: "text",  
  9.                 success: textSucceed,  
  10.                 error: Error  
  11.             });  
  12.         });  
  13.     });  
  14. //成功 
  15.     function textSucceed(result) {  
  16.         $("#tbShow").val(result);  
  17.     }  
  18. //错误函数 
  19.     function Error() {  
  20.         alert("Error!!!");  
  21.     }  
  22. </script> 
 
  
2>.Json格式 --获取时间的时，分，秒
 
  
我们需要在后台返回Json格式的数据，添加一个dll链接库，类似.Net中处理Json数据的API ，如图：
 
  
1024302.png
 
  
Json格式后台代码：
 
  
 
  
  1. Json后台  
  2. //添加引用 
  3.  using Newtonsoft.Json;  
  4.  namespace AJAX.Json  
  5.  {  
  6. public partial class jsonData : System.Web.UI.Page  
  7.      {  
  8. protectedvoid Page_Load(object sender, EventArgs e)  
  9.          {  
  10.              string hour = DateTime.Now.Hour.ToString();  
  11.              string minute = DateTime.Now.Minute.ToString();  
  12.              string second = DateTime.Now.Second.ToString();  
  13. //匿名类型 
  14.              var time = new { h = hour, m = minute, s = second };  
  15. //转Json格式 
  16.              var jsonStr = JsonConvert.SerializeObject(new[] { time });  
  17.              Response.Write(jsonStr);  
  18.              Response.End();  
  19.          }  
  20.      }  
  21.  } 
 
  
Json格式前台代码：
 
  
 
  
  1. <script src="../Scripts/jquery-1.8.0.js" type="text/javascript"></script>  
  2.     <script type="text/javascript">  
  3.         $("#btnJson").click(function () {  
  4.             $.ajax({  
  5.                 url: "jsonData.aspx",  
  6.                 type: "get",  
  7.                 dataType: "json",  
  8.                 success: jsonSuccess,  
  9.                 error: Error  
  10.             });  
  11.         });  
  12. //成功 
  13. function jsonSuccess(result) {  
  14. //[{h:10,m:20,s:30}] 
  15. //key:数组元素下标-此时为0 
  16. //value:{ h:10,m:20,s:30 } 
  17.             $.each(result, function (key, value) {  
  18. var h = value.h;  
  19. var m = value.m;  
  20. var s = value.s;  
  21.                 $("#tbShow").val(h + ":" + m + ":" + s);  
  22.             });  
  23.         }  
  24. //错误函数 
  25. function Error() {  
  26.             alert("Error!!!");  
  27.         }  
  28.     </script> 
 
  
3>.xml格式--获取用户名，出生年月
 
  
Xml格式后台代码：
 
  
 
  
  1. //添加引用 
  2. using System.Xml;  
  3. namespace AJAX.Ajax_Xml  
  4. {  
  5. public partial class XmlData : System.Web.UI.Page  
  6.     {  
  7. protectedvoid Page_Load(object sender, EventArgs e)  
  8.         {  
  9.             string name = "zld";  
  10.             string birth = "1990-1-8";  
  11. //第一种：直接字符串拼接 
  12.             string xmlStr = "<?xml version=\"1.0\" encoding=\"utf-8\" ?><root><Name>" + name + "</Name><Birth>" + birth + "</Birth></root>";  
  13. //第二种：XmlDocument创建 
  14. //创建文档 
  15.             XmlDocument xmlDocument = new XmlDocument();  
  16. //文档头声明 
  17.             XmlDeclaration xd = xmlDocument.CreateXmlDeclaration("1.0","utf-8",null);  
  18.             xmlDocument.AppendChild(xd);  
  19. //添加根节点 
  20.             XmlElement root = xmlDocument.CreateElement("root");  
  21.             xmlDocument.AppendChild(root);  
  22. //给根节点添加子节点 
  23.             XmlElement node1 = xmlDocument.CreateElement("Name");  
  24.             node1.InnerText = name;  
  25.             root.AppendChild(node1);  
  26.             XmlElement node2 = xmlDocument.CreateElement("Birth");  
  27.             node2.InnerText = birth;  
  28.             root.AppendChild(node2);  
  29. //获取节点元素 
  30.             string xmlStr2 = xmlDocument.OuterXml;  
  31.             Response.Write(xmlStr2);  
  32.             Response.End();  
  33.         }  
  34.     }  
  35. } 
 
  
Xml格式前台代码：
 
  
 
  
  1. <script src="../Scripts/jquery-1.8.0.js" type="text/javascript"></script>  
  2.     <script type="text/javascript">  
  3.         $(function () {  
  4.             $("#btnXml").click(function () {  
  5.                 $.ajax({  
  6.                     url: "XmlData.aspx",  
  7.                     type: "get",  
  8.                     dataType: "xml",  
  9.                     success: Success,  
  10.                     error: function (result) {  
  11.                         alert("相应内容非xml格式！");  
  12.                     }  
  13.                 });  
  14.             });  
  15.         });  
  16. function Success(xmlResult) {  
  17. //获取返回结果 
  18. var result = xmlResult;  
  19. //找寻根节点并循环遍历 
  20.             $(result).find('root').each(function (key) {  
  21. //获取子节点名为Name的值 
  22. var name = $(this).children("Name").text();  
  23. //获取子节点名为Birth的值 
  24. var birth = $(this).children("Birth").text();  
  25.                 $("#tbShow").val(name + ":" + birth);  
  26.             });  
  27.         }  
  28.     </script>