本文主要是介绍Dwr 联动效果实现全程:,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
昨天做到下来菜单联动了,需要用到dwr,原来没有用过,所以昨天晚上学了一个多小时,整了半天,能懂的都懂了,不会的还真是不会呀。早上到公司后黄基强一句话给我解决了所有问题。下面总结一下dwr联动效果的全程:Web.xml文件:
<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>
在WEB-INF下新建一个dwr.xml文件,内容为:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE dwr PUBLIC "-//GetAhead Limited//DTD Direct Web Remoting 0.4//EN" "http://www.getahead.ltd.uk/dwr/dwr.dtd">
<dwr>
<allow>
<create creator="new" javascript="testDwr"> <!—javascript用到的,另外对于creator的具体用法可以百度-->
<param name="class"
value="com.testDwr.TestDwr" /> <!—javascript用到的类的全部路径-->
<include method="getMap"></include>
</create>
</allow>
</dwr>
注意这个xml文件头可能会报一个过期的错误,但是不影响运行。
哦,还有一个重要步骤:别忘了把dwr的jar包放到WEB-INF/lib下。
com.testDwr.TestDwr类:
package com.testDwr;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
public class TestDwr {
public Map getMap(String key){
HashMap map = new HashMap();
if(key.equals("1")){
map.put("beijing", "北京");//value是显示出来的,map的key是option的value
map.put("ganzhou", "赣州");
}else{
map.put("New York", "纽约");
map.put("london", "伦敦");
}
return map;
}
Jsp页面:
<!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=UTF-8">
<title>Insert title here</title>
<!—下面引入的三个js文件是dwr自动生成的,其中/testjQuery 这个是我的项目名,testDwr 是dwr.xml文件配置的,这三个路径可以通过访问http://localhost:8080/testJquery/dwr(也就是项目访问路径加上”/dwr”后进入网址,复制粘贴过来。开始我这里不清楚,js文件总是找不到,因为路径不对。-->
<script type='text/javascript' src='/testjQuery/dwr/interface/testDwr.js'></script>
<script type='text/javascript' src='/testjQuery/dwr/engine.js'></script>
<script type='text/javascript' src='/testjQuery/dwr1/util.js'></script>
<script language="javascript">
function changeSelect(value){
try{
testDwr.getMap(value,fillSelect);
}catch(e){
alert(e.description);
}
}
function fillSelect(data){
try{
var q_status=$('q_status');
alert(q_status.value);
DWRUtil.removeAllOptions(q_status);
DWRUtil.addOptions(q_status,{'':'请选择'});
DWRUtil.addOptions(q_status,data);
}catch(e){
alert(e.description);
}
}
</script>
</head>
<body>
<select name="cc" οnchange="changeSelect(this.value)">
<option value="1">1</>
<option value="0">0</>
</select> <br/>
<select id="q_status">
<option value="" ></option>
</select>
<br/>
</body>
</html>
至此,一个简单的dwr联动效果就写完了。这是一个小例子,原理也就这么简单
这篇关于Dwr 联动效果实现全程:的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!