第一个dwr实例
第一个dwr的小例子
开发环境:myeclipse 6.0 + tomcat 6.0
所需jar包:dwr.jar
commons-logging-1.1.1.jar
所需jar文件下载:
https://files.cnblogs.com/arix04/lib.rar
开发步骤:
首先新建一个web project(dwr),将所需jar文件copy到dwr\WebRoot\WEB-INF\lib下
然后在dwr\src目录下写2个java类,代码如下:
dwr.Hello.java
package dwr;
public class Hello {
public String hello(String name) {
return "这是" + name + "的第一个dwr";
}
}
dwr.Book.java
package dwr;
import java.util.ResourceBundle;
public class Book {
ResourceBundle resource;
public Book() {
resource = ResourceBundle.getBundle("book");
}
public String getDescription(String key) {
return resource.getString(key);
}
}
然后在dwr\WebRoot下写2个html测试页面和2 个js文件,代码如下:
hello.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>第一个DWR程序</title>
<script type='text/javascript' src='dwr/interface/Hello.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='hello.js'></script>
</head>
<body>
<input id="user" type="text" />
<input type='button' value='你好' onclick='hello();' />
<div id="result"></div>
</body>
</html>
hello.js

function hello()
{
var user = $('user').value;
Hello.hello(user, callback);
}

function callback(msg)
{
DWRUtil.setValue('result', msg);
}book.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=BIG5">
<script type='text/javascript' src='dwr/interface/Book.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='book.js'></script>
<title>個人著∕譯作</title>
</head>
<body>
<div id="ajax" onmouseover="getBookData(this);"
onmouseout="clearData();"><a
href="http://www.gotop.com.tw/waweb2004/home/home.aspx?pg=HM010X&bn=AXP011800"><small><img
style="border: 0px solid ; width: 80px; height: 110px; float: left;"
alt="Ajax in action 中文版" title="Ajax in action 中文版"
src="images/ajax_in_action_c.jpg" hspace="10" vspace="2"></small></a></div>
<div id="spring" onmouseover="getBookData(this);"
onmouseout="clearData();"><a
href="http://www.gotop.com.tw/waweb2004/home/home.aspx?pg=HM010X&bn=ACL021000"><small><img
style="border: 0px solid ; width: 80px; height: 110px; float: left;"
alt="Spring 技術手冊" title="Spring 技術手冊"
src="images/SpringTech_S.jpg" hspace="10" vspace="2"></small></a></div>
<div id="java" onmouseover="getBookData(this);"
onmouseout="clearData();"><a
href="http://www.gotop.com.tw/waweb2004/home/home.aspx?pg=HM010X&bn=ACL020931"><small><img
style="border: 0px solid ; width: 80px; height: 110px; float: left;"
alt="Java 學習筆記" title="Java 學習筆記"
src="images/JavaGossip_Cover_Small.jpg" hspace="10"
vspace="2"></small></a></div>
<br/><br/><br/><br/><br/><br/>
<div id="info"></div>
</body>
</html>
book.js

function getBookData(ele)
{
Book.getDescription(ele.id, setBookData);
}

function setBookData(description)
{
DWRUtil.setValue('info', description);
}

function clearData()
{
DWRUtil.setValue('info', '');
}
最后,在 dwr\WebRoot\WEB-INF下配置xml文件,分别是:
web.xml
<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.4"
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">
<display-name>ajaxDWR</display-name>
<servlet>
<servlet-name>dwr-invoker</servlet-name>
<servlet-class>org.directwebremoting.servlet.DwrServlet</servlet-class>
<init-param>
<description></description>
<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>
</web-app>
dwr.xml
<?xml version="1.0" encoding="UTF-8"?>
<!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="Hello">
<param name="class" value="dwr.Hello" />
</create>
<create creator="new" javascript="Book" scope="application">
<param name="class" value="dwr.Book"/>
</create>
</allow>
</dwr>
OK,现在把整个项目部署到tomcat中运行一下试试吧,2个简单的ajax效果
项目打包下载:

浙公网安备 33010602011771号