一、Ajax简介
Adaptive Path公司的Jesse James Garrett这样定义Ajax:
Ajax不是一种技术。实际上,它由几种蓬勃发展的技术以新的强大方式组合而成。Ajax包含:
      1.基于CSS标准的表示;
      2.使用Document Object Model进行动态显示和交互;
      3.使用XMLHttpRequest与服务器进行异步通信;
      4.使用JavaScript绑定一切。
Ajax= Asynchronous JavaScript + XML 

二、常用的几种Ajax框架
   1.DWR         ---- http://getahead.ltd.uk/dwr/
   2.JSon-Rpc      ---- http://oss.metaparadigm.com/jsonrpc/
   3.echo2            ---- http://www.nextapp.com/platform/echo2/echo/
   4.backbase       ---- http://www.backbase.com
   右边网址有具体的说明:http://www.51cto.com/html/2005/1222/15373.htm

三、DWR使用说明。
示例:在页面中做个进度条,点击“install”按钮,进度条开始递增。进度数据是从后台获取。 

1.配置DWR环境。
在Eclipse中新建一个Web Project(MyEclipse\J2ee Projects\Web Project),引入dwr-0.9.2b.jar包,修改WEB-INF\web.xml文件,
配置dwr-invoker servlet。如下:
      <servlet>
        <servlet-name>dwr-invoker</servlet-name>
        <display-name>DWR Servlet</display-name>
        <description>Direct Web Remoter Servlet</description>
        <servlet-class>uk.ltd.getahead.dwr.DWRServlet</servlet-class>
        <init-param>
            <param-name>debug</param-name>
            <param-value>true</param-value>
        </init-param>
     </servlet>
     <servlet-mapping>
        <servlet-name>dwr-invoker</servlet-name>
        <url-pattern>/dwr/*</url-pattern>
     </servlet-mapping>

2.编写递增类Progress。此类只有一个方法getProgress,获取递增的数据。如下:
   package dwr.sample;
  
   import java.io.BufferedReader;
   import java.io.FileReader;
   public class Progress {
     public int getProgress(int nowProgress){   
        int nowValue=nowProgress+1;
        return nowValue;
     }
   }

3.配置dwr.xml文件。此文件和web.xml位于同一目录下。
   <!DOCTYPE dwr PUBLIC
    "-//GetAhead Limited//DTD Direct Web Remoting 1.0//EN"
    "http://www.getahead.ltd.uk/dwr/dwr10.dtd">
   <dwr> 
     <allow>
        <create creator="new" javascript="ProgressBar" >
            <param name="class" value="dwr.sample.Progress"/> 
            <include method="getProgress"/>
        </create>
     </allow>
   </dwr>

4.编写index.htm文件。
a、引入js文件。首先引入dwr自己的两个js文件:
           <script src='dwr/engine.js'></script>
           <script src='dwr/util.js'></script>
在dwr.xml中我们配置了一个名为"ProgressBar"的create 。dwr会在dwr/interface下产生一个ProgressBar.js文件。
在ProgressBar.js文件中,有一个javascript对象:ProgressBar,ProgressBar对象完成了和后台javabean:dwr
.sample.Progress的匹配。引入ProgressBar.js文件:
   <script src='dwr/interface/ProgressBar.js'></script>

b. 编写显示进度的HTML文本:
    <TABLE style="width:700;height="50" border="1" >
      <TR>
        <td>
          <TABLE  border="0" style="width:0%;height:100%" id="ProgressBar">
            <TR>
              <td bgcolor="#000099">&nbsp;</td>
            </TR>
          </TABLE>
        </td>
      </tr>
    </TABLE>
    <br>
    <!--点击Install,进度条开始跑动  -->
    <input type="button" value="Install" onclick="doProgress()"> 

c. 编写doProgress函数
 function doProgress(){
    //获取当前进度条的值,按百分比计算   
    var width=$("ProgressBar").style.width;
  //去掉进度条值后面的"%"
    var scaleWidth=width.substring(0,width.length-1);
       //当进度条值为100的时候,停止跑动
     if(scaleWidth!=100){
      //调用ProgressBar.js中的ProgressBar.getProgress函数
       ProgressBar.getProgress(scaleWidth,updateProgress);
//说明:javabean:Progress方法getProgress,其实它只有一个输入参数,一个返回参数。而javascript的ProgressBar.getProgress方法有两个参数。dwr在mapping方法的时候,对于返回值,它采用的是回调函数的方式。所以对于ProgressBar.getProgress方法的第二个参数是一个函数指针。这里是updateProgress函数。 
     }
   }
   function updateProgress(progress){
      //设置进度条的值
      $("ProgressBar").style.width=progress+"%";
   //进度条继续跑动
     doProgress();
     }