DWR简单实例

最新推荐文章于 2024-07-22 14:15:06 发布

weixin_34281537

最新推荐文章于 2024-07-22 14:15:06 发布

阅读量79

点赞数

文章标签： web.xml java javascript ViewUI

原文链接：https://my.oschina.net/ChiLin/blog/503809

版权

为什么80%的码农都做不了架构师？>>>

首先要导入DWR的jar包，同时导入common-logging包。DWR包的下载地址：http://directwebremoting.org/dwr/downloads/index.html 里面也有demo下载，有DWR的其他实例，我这里记录DWR最简单的一种Ajax技术。

导入dwr.jar和common-logging.jar后，在web.xml文件中加入DWRServlet：

<!-- 加入DWRServlet -->
  <servlet>  
        <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>  
    </servlet>  
  
    <servlet-mapping>  
        <servlet-name>dwr-invoker</servlet-name>  
        <url-pattern>/dwr/*</url-pattern>  
    </servlet-mapping>

然后写个类，这个用来给js调用：

package com.dwrdemo.pojo;

public class Hello {
    
    private String name;

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }
    
    //js将调用的方法
    public String sayHello(String name)
    {
        this.name = name;
        
        //System.out.println("DWR DEMO SUCCESS"+name);
        return "Hello "+name +" !";
    }

}

然后新建一个dwr.xml，这个文件和web.xml在同一目录，即WEB-INF下，DWR就这个核心文件：

<?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>
        <!-- 参数new表示js每调用一次就创建一个新的对象，Hello是js代码中当做类来调用的名字 -->
        <create creator="new" javascript="Hello">
            <!-- 调用哪个类 -->
            <param name="class" value="com.dwrdemo.pojo.Hello" />
            <!--
            <exclude method="..."/> 禁止访问的方法
            <include method="..."/> 可以访问的方法，默认
            -->
        </create>
    </allow>
</dwr>

jsp页面：

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://"
            + request.getServerName() + ":" + request.getServerPort()
            + path + "/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">

<title>DWR Demo</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
    <link rel="stylesheet" type="text/css" href="styles.css">
    -->
<!-- <script src="http://libs.baidu.com/jquery/2.0.0/jquery.js"></script> -->
<!-- 这两个js文件是DWR所必须的，是DWR的引擎和常用函数 -->
<script type='text/javascript' src='<%=basePath %>dwr/engine.js'></script>
<script type='text/javascript' src='<%=basePath %>dwr/util.js'></script>
<!--  该js文件是DWR根据java类生成的文件，名字和要dwr.xml里配置的类名一致，用于js访问java类 -->
<script type='text/javascript' src='<%=basePath %>dwr/interface/Hello.js'></script>
<script type="text/javascript">
function update() {
    
    var name = dwr.util.getValue("demoName");
    //alert("UPDATE"+name);
    Hello.sayHello(name, function(data) {
        dwr.util.setValue("demoReply", data);
    });
}
</script>
</head>

<body>
    <p>
        Name: <input type="text" id="demoName" /> <input value="Send"
            type="button" onclick="update()" /> <br /> Reply: <span
            id="demoReply"></span>
    </p>
</body>
</html>

最后截一下项目的目录结构图：