----------
1.首先向項目中加入dwr.jar文件,這裏我們使用maven構建，同時dwr還要依賴commons-logging.jar包，如例（pom.xml）:
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/maven-v4_0_0.xsd">
<modelVersion>4.0.0</modelVersion>
<groupId>aaa</groupId>
<artifactId>bbb</artifactId>
<packaging>war</packaging>
<version>0.0.1-SNAPSHOT</version>
<name>bbb Maven Webapp</name>
<url>http://maven.apache.org</url>
<dependencies>
<dependency>
<groupId>junit</groupId>
<artifactId>junit</artifactId>
<version>3.8.1</version>
<scope>test</scope>
</dependency>
<!-- 必需的依賴 -->
<dependency>
<groupId>org.directwebremoting</groupId>
<artifactId>dwr</artifactId>
<version>3.0.M1</version>
</dependency>
<!-- 必需的依賴 -->
<dependency>
<groupId>commons-logging</groupId>
<artifactId>commons-logging</artifactId>
<version>1.1.1</version>
</dependency>
</dependencies>
<build>
<finalName>bbb</finalName>
</build>
</project>
<script src='/[YOUR-WEBAPP-CONTEXT]/dwr/interface/[YOUR-SCRIPT].js'></script>
<script src='/[YOUR-WEBAPP-CONTEXT]/dwr/engine.js'></script>這兩個件都是虛擬文件，並不是真實的文件。
web.xml的配置如下：
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://java.sun.com/xml/ns/j2ee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd"
version="2.4">
<display-name>firstDWR</display-name>
<welcome-file-list>
<welcome-file>index.jsp</welcome-file>
</welcome-file-list>
<!-- The DWR Servlet... -->
<servlet>
<display-name>DWR Servlet</display-name>
<servlet-name>dwr-invoker</servlet-name>
<servlet-class>org.directwebremoting.servlet.DwrServlet</servlet-class>
<!-- 初始化參數，增加調試功能 -->
<init-param>
<param-name>debug</param-name>
<param-value>true</param-value>
</init-param>
<!-- 跨域調用配置信息,不是必須的 -->
<init-param>
<param-name>crossDomainSessionSecurity</param-name>
<param-value>false</param-value>
</init-param>
</servlet>
<servlet-mapping>
<servlet-name>dwr-invoker</servlet-name>
<url-pattern>/dwr/*</url-pattern>
</servlet-mapping>
</web-app>
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE dwr PUBLIC
"-//GetAhead Limited//DTD Direct Web Remoting 3.0//EN" "http://getahead.org/dwr/dwr30.dtd">
<dwr>
<allow>
<create creator="new" javascript="MathDelegate">
<param name="class" value="app.MathDelegate" />
</create>
</allow>
</dwr>
package app;
/**
* 數值計算
* @author fuhd
*/
public class MathDelegate {
/**加法*/
public int add(int a,int b){
return a+b;
}
/**減法*/
public int subtract(int a,int b){
return a-b;
}
/**乘法*/
public int multiply(int a,int b){
return a*b;
}
/**除法*/
public int divide(int a,int b){
return a/b;
}
}
5.創建jsp文件(可以是html或其它模板的文件)，如：index.jsp ：
<html>
<head>
<title>firstdwr</title>
<script type="text/javascript" src="dwr/interface/MathDelegate.js"></script>
<script type="text/javascript" src="dwr/engine.js"></script>
<script>
var a = 0;
var b = 0;
var op = "";
function doMath(){
a = document.getElementById("numA").value;
b = document.getElementById("numB").value;
op = document.getElementById("op").value;
if(op == "add"){
MathDelegate.add(a,b,doMathCallback);
op = "+";
}else if(op == "subtract"){
MathDelegate.subtract(a,b,doMathCallback);
op = "-";
}else if(op == "multiply"){
MathDelegate.multiply(a,b,doMathCallback);
op = "*";
}else if(op == "divide"){
MathDelegate.divide(a,b,doMathCallback);
op = "/";
}
}
var doMathCallback = function(answer){
document.getElementById("resultDiv").innerHTML = "<h1>" +
"Result: " + a + " " + op + " " + b + " = " + answer + "</h1>";
};
</script>
</head>
<body>
<span id="resultDiv"></span>
Please enter two numbers,select an operation,and click the equals button:
<br><br>
<input type="text" id="numA" size="4"/>
<select id="op">
<option value="add">+</option>
<option value="subtract">-</option>
<option value="multiply">*</option>
<option value="divide">/</option>
</select>
<input type="text" id="numB" size="4"/>
<input type="button" value="=" οnclick="doMath();"/>
</body>
</html>