新建一个javaweb的项目,首先需要引入jar包 有DWR.jar 和Common.logging.jar两个jar包。dwr框架系指的是Ajax的封装框架,主要用于视图层(jsp页面)和控制层(java类代码)之间的数据传输。本例中中我随意创建了一个简单的demo示例,实现jsp页面直接调用java类代码的。创建录入相关了4个文件涉及有web.xml(配置dwr.xml的容器加载),dwr.xml(配置java类代码和js映射对象),hello.jsp(页面,引用dwr的库,直接写js代码),DwrTea.java(一个java类,含有方法实现)。
首先,配置web.xml 如:
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns="http://java.sun.com/xml/ns/javaee"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"
id="WebApp_ID" version="2.5">
<!--展示的项目名称(无实际作用可省略)-->
<display-name>Personal</display-name>
<!--配置一个dwr的框架servlet -->
<servlet>
<servlet-name>dwr-invoker</servlet-name>
<!--Dwr1.x版本 -->
<!-- <servlet-class>uk.ltd.getahead.dwr.DWRServlet</servlet-class> -->
<!--Dwr2.x版本 由于本人在引用Dwr1.x版本时报错故只用了这个版本-->
<servlet-class> org.directwebremoting.servlet.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>
其次,配置dwr.xml。如图
creator创建java对象方式,new的方式,(如果是spring框架,通过框架自动产生对象,写spring方式),javascript的值是创建对象引用给js对象值是DWRTTea(此处的值与jsp代码调用java类方法一致和引用一致),<param/>引用的java包名.类名,
第三步,创建java类代码示例:
public class DwrTea {
// public DwrTea(){
// //说明了 在调用框架是 自动调用了 new DwrTea()无参构造方法 对象发赋给js对象
// }
public String getDWRwords(){
String s="你好!我是Dwr框架 的<会话连接建立>";
System.out.println(s);
return s;
}
public String hellodwr(String name){
return "你好Dwr 来自js"+name;
}
}
第四步:创建jsp页面。
<head 下引用以下固定标签。注意'dwr/interface/DWRTTea.js' 中的DWRTTea名称与dwr.xml命名一致。
<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/DWRTTea.js'> </script>
<script language="javascript">
//调用无参数Java方法
function sayHello() {
alert("sf");
DWRTTea.getDWRwords(
function(data){
alert("ssss");
dwr.util.setValue("helloDwrReply", data);
});
}
//调用有参数的方法
function getg(){
var name = dwr.util.getValue("name"); //参数
DWRTTea.hellodwr(name,function(data){
dwr.util.setValue("helloDwrReply",data);
});
}
</script>
</head>
<body>
<input type="button" value="DWRTea()" οnclick="sayHello()" />
<br>Replied:
<!-- 显示HelloDwr.sayHello方法的返回值 -->
<div id="helloDwrReply"></div>
<hr/>
<p>
<input id="name" type="text">
<input type="button" value="有参数的构造方法" οnclick="getg()" />
</p>
</body>