使用 XMLHttpRequest 实现 Ajax 一：取回动态页面响应

 概念什么的没必要提了

假设一个页面需要无刷新取回服务器数据，当然我们要用到 XMLHttpRequest ，构建函数如下：

 

  <script type="text/javascript">
         var xmlhttp;
         function RetrieveData() {
             //实例化XMLHttpRequest对象
             xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
             //找到名为“Text1”的文本框
             var name = document.getElementById("<%=TextBox1.ClientID%>");
             //利用Open方法向指定URL
             //查询字符串“name”将文本框中的数据传送到目标页面
             xmlhttp.open("Post", "DataHandler.aspx?requestString=" + name.value);
             //设置当服务器响应返回时用于处理响应的函数名
             xmlhttp.onreadystatechange = OnMessageBack;
             //送发请求
             xmlhttp.send(null);
         }

         function OnMessageBack() {
             //判断请求状态及HTTP状态是否都能满足条件
             if (xmlhttp.readystate == 4 && xmlhttp.status == 200) {
                 //将返回的文本打印到页面上
                 var data = xmlhttp.responseText.split('<!');
                 document.getElementById("<%=Label1.ClientID%>").innerHTML = data[0];   //xmlhttp.responseText;
             }
         }

    </script>

 

Html 控件如下：

 

<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<input id="Button1" type="button" value="button"  onclick="RetrieveData()" />
<asp:Label ID="Label1" runat="server" Text="Here is the value"></asp:Label> 

 

DataHandler.aspx 的后台代码如下

 protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
            {
                if (this.Request.QueryString["requestString"] != null)
                {
                    this.Response.Clear();
                    this.Response.Write("Hello：  " + this.Request.QueryString["requestString"].ToString());

　　　　　　　// 访问数据库或服务端组件或服务          

　　　　      }
                else
                {
                    this.Response.Clear();
                    this.Response.Write("Hello  no name");
                }
            }

        }