1，从官方网站下载DWR https://dwr.dev.java.net/files/documents/2427/32252/dwr.war 把他直接放到TOMCAT_HOME/webapps 下面
2，编写一个Java类如下：
package org.getahead.dwrdemo.simpletext;
import java.io.IOException;
import javax.servlet.ServletException;
import org.directwebremoting.WebContext;
import org.directwebremoting.WebContextFactory;
/**
* Some simple text demos
* @author Joe Walker [joe at getahead dot ltd dot uk]
*/
public class Demo
{
/**
* Return a server side string to display on the client in real time
* @param name The name of person to say hello to
* @return A demo string
*/
public String sayHello(String name)
{
return "Hello, " + name;
}
/**
* Fetch a resource using forwardToString()
* @return a demo HTML page
* @throws ServletException If the servlet engine breaks
* @throws IOException If the servlet engine breaks
*/
public String sayBye(String name){
return "bye-bye,"+name;
}
public String sayWelcome(){
return "welcome";
}
public String showTitle(String name,String title){
return name+":"+title;
}
public int showNumber(){
return 1;
}
public boolean showBool(String name){
if(name==null){
name="";
}
if(name.indexOf("janny")!=-1){
return true;
}else{
return false;
}
}
public String getInclude() throws ServletException, IOException
{
WebContext wctx = WebContextFactory.get();
return wctx.forwardToString("simpletext/forward.html");
}
}
3, 把DRWTest类配置在dwr.xml中，dwr.xml是DWR的配置文件，所有需要在JavaScript中调用的java的类都必须在这个文件中描述 。这个文件的位于TOMCAT_HOME/webapps/dwr/WEB-INF/dwr.xml. 在<allow>标签中添加以下内容
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE dwr PUBLIC "-//GetAhead Limited//DTD Direct Web Remoting 2.0//EN" "http://getahead.org/dwr/dwr20.dtd">
<dwr>
<allow>
<create creator="new" javascript="Demo">
<param name="class" value="org.getahead.dwrdemo.simpletext.Demo"/>
</create>
</allow>
</dwr>
4，在web。xml里必须要加的内容
<?xml version="1.0" encoding="ISO-8859-1"?>
<!DOCTYPE web-app PUBLIC
"-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN"
"http://java.sun.com/dtd/web-app_2_3.dtd">
<web-app id="dwrtest">
<welcome-file-list>
<welcome-file>
index.jsp
</welcome-file>
</welcome-file-list>
--------------------------------------这是必须要加的内容--------------------------------------------
<servlet>
<servlet-name>dwr-invoker</servlet-name>
<display-name>DWR Servlet</display-name>
<description>Direct Web Remoter Servlet</description>
<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>activeReverseAjaxEnabled</param-name>
<param-value>true</param-value>
</init-param>
<init-param>
<param-name>initApplicationScopeCreatorsAtStartup</param-name>
<param-value>true</param-value>
</init-param>
<init-param>
<param-name>maxWaitAfterWrite</param-name>
<param-value>500</param-value>
</init-param>
<load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>dwr-invoker</servlet-name>
<url-pattern>/dwr/*</url-pattern>
</servlet-mapping>
</web-app>
5，在index。html页面里html的内容
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Simple Text Generation Demo</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<script type='text/javascript' src='../tabs/tabs.js'> </script>
<!---------------------------------------这是必须要加的内容--------------->
<script type='text/javascript' src='../dwr/engine.js'> </script>
<script type='text/javascript' src='../dwr/util.js'> </script>
<script type='text/javascript' src='../dwr/interface/Demo.js'> </script>
<!--------------------------------------------------------------------------------->
<!----------------------------------这是要修改的javascript----------------------------------------->
<script type="text/javascript" src='index.js'> </script>
<!------------------------------------------------------------------------------------------------------->
<link rel="stylesheet" type="text/css" href="../tabs/tabs.css" />
<link rel="stylesheet" type="text/css" href="../generic.css" />
</head>
<body οnlοad="dwr.util.useLoadingMessage();Tabs.init('tabList', 'tabContents');">
<div id="page-title">[
<a href="http://getahead.org/dwr/">DWR Website</a> |
<a href="..">Web Application Index</a>
]</div>
<h1>Dynamically Updating Text</h1>
<p>This is a simple demonstration of how to dynamically update a web-page with
text fetched from a web server.</p>
<div id="demoDiv">
<p>
Name:
<input type="text" id="demoName" value="Joe"/>
<input value="Hello" type="button" οnclick="hello()"/>
<input value="Bye" type="button" οnclick="bye()"/>
<input value="Welcome" type="button" οnclick="welcome()"/>
<input value="showTitle" type="button" οnclick="showTitle()"/>
<input value="shownubmer" type="button" οnclick="shownumber()"/>
<input value="showbool" type="button" οnclick="showbool()"/>
<br/>
Reply: <span id="demoReply" style="background:#eeffdd; padding-left:4px; padding-right:4px;"></span>
</p>
</div>
</body>
</html>
6，index。js的修改
function hello() {
var name = dwr.util.getValue("demoName");
//注意：Demo.sayHello(name,function(data)...)是跟java类相似的
Demo.sayHello(name, function(data) {
dwr.util.setValue("demoReply", data);//这个setValue方法是dwr本身就带着
});
}
function bye() {
var name = dwr.util.getValue("demoName");
Demo.sayBye(name, function(data) {
dwr.util.setValue("demoReply", data);
});
}
function welcome() {
var name = dwr.util.getValue("demoName");
Demo.sayWelcome(function(data) {
dwr.util.setValue("demoReply", data+" to china! "+name);
});
}
function showTitle() {
var name = dwr.util.getValue("demoName");
Demo.showTitle(name,"你在北京",function(data) {
dwr.util.setValue("demoReply", data);
});
}
function shownumber() {
var name = dwr.util.getValue("demoName");
Demo.showNumber(function(data) {
dwr.util.setValue("demoReply", data);
});
}
function showbool() {
var name = dwr.util.getValue("demoName");
Demo.showBool(name,function(data) {
if(data==true){
dwr.util.setValue("demoReply", "你好呀"+name);
}else{
dwr.util.setValue("demoReply", "哭死我了"+name);
}
});
}
7, 运行，在浏览器中输入 http://localhost:8080/dwr/index.html
558
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
