DWR之DWR实例(1)

最新推荐文章于 2021-02-13 15:31:30 发布

fhd001

最新推荐文章于 2021-02-13 15:31:30 发布

阅读量1.1k

点赞数

分类专栏： DWR 文章标签： dwr encoding button maven function javascript

本文链接：https://blog.csdn.net/fhd001/article/details/7063281

版权

DWR 专栏收录该内容

25 篇文章 0 订阅

订阅专栏

DWR之DWR实例(1)
----------

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>

2.在web.xml文件中增加DWRSevlet的配置，DWR指定映射路径的js(如：带有/dwr)都由这个servlet处理，就像这些路径的js(带有/dwr的路径)：

<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>

3.创建dwr.xml文件(与web.xml在同一个目录):

<?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>

4.创建java文件，如：MathDelegate.java文件：

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>

fhd001

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
DWR之DWR实例(1)

DWR之DWR实例(1)----------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
复制链接

扫一扫