标签:
最近在做一个网站项目时,有异步请求的需求,经过一番查找资料,终于实现了这个部分,在此记录一下,以备日后回顾.
1.jQuery的ajax函数可以很方便的建立发起异步请求
$(".drop-a").click(function () { var content = $(this).next("div"); if (isGet == false) { var code = $("#code").html(); var data = { code: code, table: "acount" }; $.ajax({ type: "POST", url: "../response/getinfo.ashx", data: data, dataType: "text", success: function (msg) { //$("#ajax").append(msg); alert(msg); isGet = true; } }); }
本示例调用../response/getinfo.ashx(一般处理程序)
2.getinfo.ashx内容
public void ProcessRequest(HttpContext context) { string code = context.Request["code"]; string table = context.Request["table"]; string sql = string.Format("select * from `{0}` where `{1}` = ‘{2}‘", table, "code", code); DataTable getTable = BasicQuery.ExecuteDataTable(sql); //调用MYSQL查询函数 string json = JsonConvert.SerializeObject(getTable);//将Object转化为json文本 context.Response.ContentType = "text/plain"; context.Response.Write(json);//响应输出json文本 }
接收code和表名作为参数查询数据库,并响应输出一段字符串(json文本)
3.JQuery.ajax处理返回的json数据
$.ajax({ type: "POST", url: "../response/getinfo.ashx", data: data, dataType: "text", success: function (msg) { //$("#ajax").append(msg); //alert(msg); var json = $.parseJSON(msg); var html = ""; html += "<p>ID:" + json[0].ID; html += "</p><p>Code:" + json[0].Code; html += "</p><p>Name:" + json[0].Name; html += "</p><p>Phone:" + json[0].Phone; html += "</p><p>Mail:" + json[0].Mail; html += "</p>"; content.html(html); isGet = true; } });
在这段代码中,首先将返回的json字符串转化为对象(数组),然后根据返回数据的内容解析出需要的信息,并加载到网页中.
标签:
原文地址:http://www.cnblogs.com/rolrence/p/4955815.html