利用xmlHttp实现一个简单的Ajax无刷新

        最近在研究无刷新方面的技术，今天偶然遇到一个网友，和他讨论了一下。
        下面是利用xmlHttp实现一个简单的Ajax：
        以下是CodeNameClient.apsx的html的source：

<% @ Page language = " c# "  Codebehind = " CodeNameClient.aspx.cs "  AutoEventWireup = " false "  Inherits = " CodeName.CodeNameClient "  codePage = " 932 " %>
<! DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"  >
< HTML >
     < HEAD >
         < title > WebForm1 </ title >
         < meta  name ="GENERATOR"  Content ="Microsoft Visual Studio .NET 7.1" >
         < meta  name ="CODE_LANGUAGE"  Content ="C#" >
         < meta  name ="vs_defaultClientScript"  content ="JavaScript" >
         < meta  name ="vs_targetSchema"  content ="http://schemas.microsoft.com/intellisense/ie5" >
         < link  type ="text/css"  rel ="stylesheet"  href ="StyleSheet.css" >
         < script  language ="JavaScript" >
         <!--
             function  Test(objSrc,objDes) 
            {
                 try  {
                    xmlHttp  =   new  ActiveXObject( " Microsoft.XMLHTTP " );
                }  catch (e) {
                    xmlHttp  =   new  XMLHttpRequest();
                }
        
                xmlHttp.onreadystatechange  =   function () {
                     if  (xmlHttp.readyState  ==   4 ) {
                         if  (xmlHttp.status  ==   200 ) {
                             var  data  =  xmlHttp.responseText;
                            document.getElementById(objDes).value  =  data;
                        }
                    }
                }
        
                xmlHttp.open( " GET " , " CodeNameServer.aspx?testid= "   +  objSrc.value);
                xmlHttp.send( null );
            }
         -->
         </ script >
     </ HEAD >
     < body  ms_positioning ="GridLayout" >
         < form  id ="FromCodeName"  method ="post"  runat ="server" >
             < table  id ="Table1"  height ="100%"  cellspacing ="0"  cellpadding ="0"  width ="100%"  border ="0" >
                 < tr >
                     < td  nowrap align ="right"  width ="20%" > 改变文本内容：
                     </ td >
                     < td  nowrap align ="left"  width ="20%" >< asp:textbox  id ="TextBoxJCode1"  runat ="server"  height ="25px" ></ asp:textbox ></ td >
                     < td  nowrap align ="left"  width ="15%" > 服务器端返回： </ td >
                     < td  nowrap align ="left"  width ="45%" >< asp:textbox  id ="TextBoxJName1"  runat ="server"  height ="25px"  width ="296px" ></ asp:textbox ></ td >
                 </ tr >
             </ table >
         </ form >
     </ body >
</ HTML >

        该aspx页面中的js中的Test()实现一个递归的用xmlHttp读取指定的url的Response信息，并把读取的值赋给TextBoxJName1。

以下是CodeNameClient.apsx.cs：

using  System;
using  System.Collections;
using  System.ComponentModel;
using  System.Data;
using  System.Drawing;
using  System.Web;
using  System.Web.SessionState;
using  System.Web.UI;
using  System.Web.UI.WebControls;
using  System.Web.UI.HtmlControls;

namespace  CodeName
{
    public class CodeNameClient : System.Web.UI.Page
    {

        protected System.Web.UI.WebControls.TextBox TextBoxJCode1;
        protected System.Web.UI.WebControls.TextBox TextBoxJName1;
    
        private void Page_Load(object sender, System.EventArgs e)
        {
            TextBoxJCode1.Attributes.Add("onchange","Test(this,'TextBoxJName1');");
        }

        #region
        override protected void OnInit(EventArgs e)
        {
            InitializeComponent();
            base.OnInit(e);
        }
        
        private void InitializeComponent()
        {    
            this.Load += new System.EventHandler(this.Page_Load);

        }
        #endregion
    }
}

CodeNameServer:（必须是一个空白的文件的aspx，不能有任何的html标签）
以下是CodeNameServer.aspx：(只有这一行)

<% @ Page language = " c# "  Codebehind = " CodeNameServer.aspx.cs "  AutoEventWireup = " false "  Inherits = " CodeName.CodeNameServer "   %>

以下是CodeNameServer.aspx.cs:

using  System;
using  System.Collections;
using  System.ComponentModel;
using  System.Data;
using  System.Drawing;
using  System.Web;
using  System.Web.SessionState;
using  System.Web.UI;
using  System.Web.UI.WebControls;
using  System.Web.UI.HtmlControls;

namespace  CodeName
{

 public class CodeNameServer : System.Web.UI.Page
 {
  private void Page_Load(object sender, System.EventArgs e)
  {  
            string testid = "";

            if (Request.QueryString.Keys.Count > 0 && Request.QueryString["testid"].Length > 0)
            {
                testid = Request.QueryString["testid"];                
            }            

            Response.Write("要返回去的结果："+testid );            
  }

  #region
  override protected void OnInit(EventArgs e)
  {
   InitializeComponent();
   base.OnInit(e);
  }
  
  private void InitializeComponent()
  {    
   this.Load += new System.EventHandler(this.Page_Load);
  }
  #endregion
 }
}

            CodeNameServer实现获取客户端xmlHttp打开的CodeNameServer.aspx?testid=XXX中的testid的值，并Response输出，并立即被CodeNameClient中的xmlHttp读取。

        右边的运行结果是不是正确？TextBoxJName1的值是不是等于“要返回去的结果：”TextBoxJCode1的值？

        本文是和csdn网友一起讨论。

 

转载于:https://www.cnblogs.com/jintan/archive/2005/09/19/239781.html