jquery 实现客户端与服务端数据交互

　　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 ：

　  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; 　　} 　　} 　　}　

　　说明情况

　　$.ajax({ 　　type:'post',//这里页面数据发送请求的方式可以为post和get 　

       ache:'false ', //这里可以为false或者true 是否要缓存 ，默认为false 　　url : 'XXXXX/XXX.ashx',//这里页面通过webhttprequest 请求处理的类路径最好写物理路径 　

       atatype：'json',//这里传出的数据格式可以为json类型和text类型

　　data: flag:'del',id:'ID',$('#id').val()//这里可以写入你要传过去处理的数据和类型等等

　　success:function(data){},//这里返回经过处理的得到的服务端数据

　　error: function (XMLHttpRequest, textStatus, errorThrown)

        {

         　　alert(''); 　　});

　　这样就可以实现页面的局部数据的服务端和客户端数据交互了。

 本站技术原创栏目文章均为中睿原创或编译，转载请注明：文章来自中睿，本站保留追究责任的权利。