dwr学习札记（一） _Web前端

dwr学习笔记（一）
像以前学习编程语言一样，学习dwr第一步，也不免先写一个类似于hello，world这样的小代码，在这里闲话暂且按下，我们来看具体代码。

具体代码如下：

  index.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>
    <title>DWR - Test Home</title>
    <script type='text/javascript' src='dwr/interface/Demo.js'></script>
    <script type='text/javascript' src='dwr/engine.js'></script>
    <script type='text/javascript' src='dwr/util.js'></script>
    <script>
      function load()
      {
        JavaDate.getYear(loadCallBack);
      }
      function loadCallBack(data)
      {
          alert(data+1900+'年');
      }
      function hello()
      {
          var name = document.getElementById("name").value;
          Demo.sayHello(name,callBack);
      }
      function callBack(data)
      {
          dwr.util.setValue("result", data);
      }
    </script>
  </head>
  <body>
      <input type="text" name="name" id="name"/>
      <input type="button" onclick="hello();" name="button" value="button">
      <span id="result" style="background: #eeffdd; padding: 10px"></span>   
  </body>
  </html>

Demo.java:

 package com.wise.ajax;

  public class Demo {
     public String sayHello(String name){
          String str = "hello,"+name;
          return str;
      }
  }

web.xml

<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.5" xmlns="http://java.sun.com/xml/ns/javaee"
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
    http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">

    <servlet>
        <servlet-name>dwr-invoker</servlet-name>
        <servlet-class>uk.ltd.getahead.dwr.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>
    <welcome-file-list>
        <welcome-file>index.jsp</welcome-file>
    </welcome-file-list>
</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="JavaDate">
      <param name="class" value="java.util.Date"/>
    </create>
    <create creator="new" javascript="Demo">
      <param name="class" value="com.wise.ajax.Demo"/>
    </create>
  </allow>
</dwr>

类和配置文件都不难理解，另外dwr.util.setValue("result", data);一看就知道是<script type='text/javascript' src='dwr/util.js'></script> 中赋值的方法，sayHello(name,callBack)也容易理解，name是传入Demo.sayHello的参数，callBack是回调方法， getYear(loadCallBack)中getYear是不需要参数的，这里只需要指定回调方法即可。关键在于回调方法 callBack(data)中这个data，看了半天没看明白，后来上百度百科一查，才知道这个data是用于接收方法的返回值，也就是接收 Demo.sayHello这个方法的返回值。
另外既然dwr.util.setValue("result", data)可以赋值，当然dwr.util.getValue("result")就可以取得result的值咯，相当于document.getElementById("name").value;