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

浏览数：23 / 时间：2015年06月09日

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()，该方法便根据后台的处理结果，进行页面处理。

郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。

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