Ajax学习(一)

Ajax技术在当前的web开发领域显得非常热门、使这个称"新瓶装旧酒"的技术一下子成为人门口中的热门词汇！为了不让自己落伍、在繁忙的工作之余、偶也开始学习Ajax...(这里用的是Ajax.Net框架)
下是一个小例子、来说明Ajax所带来的用户体验!
1.新建一个项目、添加对Ajax.dll的引用
2.web.config中设置
<system.web>
   <httpHandlers>
   <add verb="POST,GET" path="ajax/*.ashx" type="Ajax.PageHandlerFactory, Ajax" />
 </httpHandlers>
.................
<system.web>
3.WebForm1.aspx代码如下：(通过js调用服务端方法)

< HTML >
     < HEAD >
         < title > Ajax学习(一) </ 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" >
         < script  language ="javascript" >
        function ClientAdd()
        {
            var first=document.all("first");
            var second=document.all ("second");
            var result=document.all ("result");
            result.value=WebForm1.ServerSideAdd(first.value,second.value).value;
            // 调用服务器端方法：类名.方法
        }
         </ script >
     </ HEAD >
     < body >
         < form  id ="Form1"  method ="post"  runat ="server" >
             < input  id ="first"  type ="text"  size ="5" > + < input  id ="second"  type ="text"  size ="5" > = < input  id ="result"  type ="text"  size ="5" > &nbsp; < input  id ="calc"  type ="button"  value ="计算"  onclick ="ClientAdd()" >
         </ form >
     </ body >
</ HTML >

4.WebForm1.aspx.cs代码如下：

private   void  Page_Load( object  sender, System.EventArgs e)
         {
            Ajax.Utility.RegisterTypeForAjax (typeof(WebForm1));
        }

        [Ajax.AjaxMethod ()]
         public   int  ServerSideAdd( int  firstNumber, int  secondNumber)
         {
            return firstNumber+secondNumber;
        }

5.运行界面如：

在文本框中输入数字后点击"计算按钮"，调用服务器端方法获得结果、但是整个页面并没有刷新、只是结果的值发生了改变、
6.代码下载/Files/chy710/AjaxTest1.rar