簡單的html代碼，儲存了ajax.html就可以了。
| 代碼如下 |
複製代碼 |
<a id="ViewInfo" href="javascript:void(0)" class="link" onclick="ViewMsg(<%#Eval("RecordID")%>);return false;">查看全部</a>
<div id="ViewMsg" style="background-color:#fff; padding:10px;" class="inbox">
<p>
<b>
<label id="lblSender"></label>
</b>
<label style="margin-left: 10px;">
<label id="lblSendTime"></label>
</label>
</p>
<p>
<label id="lblContent"></label>
</p>
<p style="text-align:right;">
<input type="button" class="button" value="關閉本頁" onclick="closeViewMsg();" />
<input id="delMsg" type="button" class="button" value="刪除本訊息" />
</p>
</div> |
引用 jquery.js 和 date.f-0.5.0.js（json 日期轉換）
| 代碼如下 |
複製代碼 |
function ViewMsg(id) {
$.ajax({
type: "post",
cache: false,
url: "/user/accountmanage/mymessage/MsgHandler.ashx?id=" + id + "&type=view",
datatype: "json",
data:'',//可以在這裡寫需要http請求的參數。
success: function (data) {
$('#lblSender').html(data.Sender);
$('#lblSendTime').html(new Date(parseInt(data.SendTime.substr(6))).f('yyyy-MM-dd'));//json 日期文字轉換成 string日期 格式
$('#lblContent').html(data.Content1);
var message = data.RecordID;
$('#delMsg').bind('click', { msg: message }, function (event) { confirm("確定要刪除?");
$.ajax({
type: "post",
cache: false,
url: "/user/accountmanage/mymessage/MsgHandler.ashx?id=" + event.data.msg + "&type=del",
datatype: "text",
success: function (data) { location.href = location; },
error: function (XMLHttpRequest, textStatus, errorThrown) {
alert('');
}
});
});
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
alert('');
}
});
} |
建立一個一般處理常式 MsgHandler.ashx 注意文檔編碼和jquery ajax檔案編碼必須一致，否則可能出現亂碼問題。
| 代碼如下 |
複製代碼 |
public class MsgHandler : IHttpHandler
{ public void ProcessRequest(HttpContext context)
{
if (context.Request.QueryString["type"] == "view")
{
context.Response.ContentType = "application/json";
int id = JSSDW.Utils.StringUtils.ToInt32(context.Request.QueryString["id"], 0);//這個是把string類型轉換為int類型，預設為0，可以直接用convert.into32()
WebBiz.Message messageBiz = new WebBiz.Message();
Interface.Message message = messageBiz.GetMessageInfo(id);
string json = new JavaScriptSerializer().Serialize(message);//把實體類轉為json格式輸出
context.Response.Write(json);
}
else
{
context.Response.ContentType = "application/text";
int id = JSSDW.Utils.StringUtils.ToInt32(context.Request.QueryString["id"], 0);
WebBiz.Message messageBiz = new WebBiz.Message();
messageBiz.DeleteMessageInfo(id);
context.Response.Write("刪除成功");
}
} public bool IsReusable
{
get
{
return false;
}
}
} |
下面這段代碼是主要的了，就是發送類型為post資料了，然後返回 類型為json上面有個json檔案，還有一個url就是請求處理資料的url
| 代碼如下 |
複製代碼 |
$.ajax({ type:'post',//這裡頁面資料發送請求的方式可以為post和get cache:'false ', //這裡可以為false或者true 是否要緩衝 ，預設為false url : 'XXXXX/XXX.ashx',//這裡頁面通過webhttprequest 請求處理的類路徑最好寫實體路徑 datatype：'json',//這裡傳出的資料格式可以為json類型和text類型 data: flag:'del',id:'ID',$('#id').val()//這裡可以寫入你要傳過去處理的資料和類型等等 success:function(data){},//這裡返回經過處理的得到的服務端資料 error: function (XMLHttpRequest, textStatus, errorThrown) {
alert('');
}); |
總結：
本文章簡單的講述了關於利用了$.ajax的post方法來發送請求返回json資料然後我們進來處理，由於使用了外掛程式我們節省了大量的關於ajax相容這塊的處理，至於asp.net這段代碼我們不講解了。
