·您现在的位置： 云翼网络 >> 文章中心 >> 网站建设 >> 网站建设开发 >> ASP.NET网站开发 >> 使用ICallbackEventHandler接口实现轻量级的Ajax效果

【如有意向点此提交需求】关于我们

使用ICallbackEventHandler接口实现轻量级的Ajax效果

作者：佚名      ASP.NET网站开发编辑：admin      更新时间：2022-07-23

使用ICallbackEventHandler接口实现轻量级的Ajax效果

1，网上关于ICallbackEventHandler的实现效果比较多，之所以继续写关于这个接口的使用有几个原因：(1)时间长了，容易忘记这个接口该怎么使用，肯定又要去搜索。(2)搜索出一堆别人的博客，看着别人写的不舒坦，不爽，所以自己按自己的想法想怎么写就怎么写。(3)看到自己写的博客，几乎很容易就立马想起来当时怎么使用的，很快就知道怎么使用了。(4)还有个原因就是，最近项目不紧，也不知道学点啥，就随便敲几行字。

2，ICallbackEventHandler接口弥补了Ajax框架的不足！Ajax框架比较大，会在前台生成很多的Js代码。而ICallbackEventHandler接口却没有那么麻烦，他的逻辑，也就是前台控件触发(click,doubleclick,mouSEOver,blur,focus),不管哪种触发方式，让他指定执行前台的一个Js方法(该方法是在后台Page_load使用RegisterClientScriptBlock()方法注册到前台)。然后这个Js方法会执行后台的一个方法，后台根据参数经过业务处理，将处理结果赋值给一个属性，然后后台回调方法中将这个属性的值返回，页面前台早已注册好的方法便会根据这个返回值进行相关处理。

3，根据这个逻辑，我写了一个小的Demo，根据用户输入的手机号，判断当前手机号是否已经注册。

(1),前台HTML代码

<html xmlns="http://www.w3.org/1999/xhtml"><head runat="server">    <title></title>    <script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>    <script type="text/Javascript">        function receiveServerDataNew(returnVal) {            $("#warn").html(returnVal);        }        $(function () {            $("input[id*='TB_MobilePhone']").blur(function () {                var mobilePhone = $("input[id*='TB_MobilePhone']").val();                callServerEvent(mobilePhone, "");            });        })    </script></head><body>    <form id="form1" runat="server">    <div>    姓    名：<asp:TextBox ID="TB_UserName" runat="server"></asp:TextBox><br />    密    码：<asp:TextBox ID="TB_HiddenCode" runat="server"></asp:TextBox><br />    手机号：<asp:TextBox ID="TB_MobilePhone" runat="server"></asp:TextBox><span id="warn" style=" color:Red";></span>    </div>    </form></body></html>

(2),后台代码

public partial class _Default : System.Web.UI.Page,ICallbackEventHandler    {        PRotected void Page_Load(object sender, EventArgs e)        {            //获取一个对客户端函数的引用；调用该函数时，将启动一个对服务器端事件的客户端回调。此重载方法的客户端函数包含指定的控件、参数、客户端脚本和上下文            String cbReference = Page.ClientScript.GetCallbackEventReference(this, "arg", "receiveServerDataNew", "context");            String callbackScript = "function callServerEvent(arg, context)" + "{ " + cbReference + ";}";            //往前台注册脚本            Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "callServer", callbackScript, true);        }        private string _CallBackResult = "";         public string GetCallbackResult()        {            return _CallBackResult;        }        public void RaiseCallbackEvent(string eventArgument)        {            if (eventArgument=="")            {                _CallBackResult = "手机号不能为空";            }            //自己查数据库去吧            if (eventArgument=="18866668888")            {                _CallBackResult = "当前手机号已经注册";            }        }    }

4，页面一加载，首先执行后台的Page_Load事件，然后callServerEvent这个方法就注册到前台了，前台页面一生成，便给手机号那个文本框注册了，失去焦点事件，失去焦点的事件里面执行callServerEvent()方法(传入俩个参数)，调用后台的RaiseCallbackEvent(string eventArgument)方法，该方法经过业务逻辑处理，赋值给_CallBackResult属性，GetCallbackResult()方法将处理结果返回，同时调用前台方法receiveServerDataNew()，该方法便根据后台的处理结果，进行页面处理。