一、 ajax的介绍。
ajax = asynchronous javascript and xml(异步的 javascript 和 xml)。
ajax 不是新的编程语言,而是一种使用现有标准的新方法。
ajax 最大的优点是在不重新加载整个页面的情况下,可以与服务器交换数据并更新部分网页内容。
ajax 不需要任何浏览器插件,但需要用户允许javascript在浏览器上执行。
二、 dwr的介绍
1. 官网地址 http://directwebremoting.org
2. dwr is easy ajax for java。dwr(direct web remoting)是一个用于改善web页面与java类交互的远程服务器端ajax开源框架,可以帮助开发人员开发包含ajax技术的网站。它可以允许在浏览器里的代码使用运行在web服务器上的java函数,就像它就在浏览器里一样。
三、 代码实现
1. jar包下载
下载地址最好去官网下载。总共不到1m,所以不需要下载多久。
下载地址:https://github.com/directwebremoting/dwr/releases/download/3.0.2-release/dwr.jar
2. 配置dwr
(1)eclipse或者myeclipse创建web项目此处不再重复,需要注意的是最好是选择显示web.xml文件,因为后面用得到。
(2)在web-inf目录下创建 dwr.xml 文件。这个就是dwr的配置文件。配置文件中的代码如下:
其他地方一般不需要更改,需要注意的是javascript=demo此处的demo可以自己起名,
还有value=cn.smileyan.cy.cyservice这个也可以自己修改。注意要与src目录下一一对应。
也就是说我在cn.smileyan.cy包下有个类名字叫做cyservice,这个类是ajax方法与后台交流的关键类。
<?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="demo" scope="application"> <include method="get"/> <param name="class" value="cn.smileyan.cy.cyservice"/> </create> </allow> </dwr>
(3) web.xml中添加dwr配置
<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> </servlet> <servlet-mapping> <servlet-name>dwr-invoker</servlet-name> <url-pattern>/dwr/*</url-pattern> </servlet-mapping>
3. 前端代码
特别提醒,需要注意引入dwr的script代码,记得对应到demo.js
<%@ page language="java" contenttype="text/html; charset=iso-8859-1" pageencoding="iso-8859-1"%> <!doctype html public "-//w3c//dtd html 4.01 transitional//en" "http://www.w3.org/tr/html4/loose.dtd"> <html> <head> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1"> <title>insert title here</title> <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/demo.js"></script> <script> function dotest(){ demo.get(callback); /*此处.get对应的是java类中的方法*/ } var callback = function dddddddd(data){ dwr.util.setvalue("demo",data); } </script> </head> <body> <input type="button" value="time" onclick="dotest()"/> <input type="text" id="demo" size="40"> </body> </html>
4. java代码
package cn.smileyan.cy; public class cyservice { public string get(string str) { return "hello dwr !"; } }
5. 运行,然后点击按钮查看效果
四、 总结
这个例子非常简单,但是这个与简答的js实现隐藏与显示是不同的,因为这个其实是把java代码转换成js代码,也就是cyservice类对应成了demo.js,demo.get方法实际调用的是cyservice的对象的get方法。
这样做的好处就是在没有跳转的情况下实现了与后台的交互,大大提高了用户体验。
相关推荐:
dwr 实现ajax学习
dwr与ajax的微妙关系
b/s模式下的即时通讯,使用ajax框架dwr实现
dwr框架体验(实现基于ajax的无刷新效果)
以上就是dwr如何实现ajax的详细内容。
