<%@ page language="java" contentType="text/html; charset=UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>动态加载列表框</title>
</head>
<script type="text/javascript">
var xmlHttp ;
function createXMLHttpRequest() {
if(window.ActiveXObject) {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP") ;
}else if(window.XMLHttpRequest) {
xmlHttp = new XMLHttpRequest() ;
}
}
function select_change() {
var depart = document.getElementById("depart").value ;
if(depart != null) {
createXMLHttpRequest() ;
var url = "dylist.jsp?depart="+depart ;
xmlHttp.open("GET",url,true) ;
xmlHttp.onreaddystatechange = showMembers ;
xmlHttp.send(null) ;
}
}
function showMembers() {
if(xmlHttp.readyState ==4) {
if(xmlHttp.status = 200) {
var membersData = xmlHttp.responseXML.getElementByTagName("member") ;
var membersSelect = document.getElementById("member") ;
var option = null ;
memberSelect.options.length = 0 ;
//循环将数据插入列表框中
for(var i=0 ;i<memberData.length;i++) {
try {
membersSelect.appendChild(option) ;
}catch(e) {
alert(e) ;
}
}
}else {
alert("您请求的页面有异常发生");
}
}else {
//信息还没有返回,等待
}
}
</script>
<body>
部分<br>
<select id="depart" onchange="select_change()">
<option value="null">选择</option>
<option value="d1">部门一</option>
<option value="d2">部门二</option>
<option value="d3">部门三</option>
<option value="d4">部门四</option>
</select>
<select id="member" multiple="multiple">
</select>
</body>
</html>
dylist.jsp
<%@ page language="java" import="java.util.*" contentType="text/html; charset=UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>动态加载列表框</title>
</head>
<body>
<%
String depart = request.getParameter("depart") ;
if(depart == null) depart = "d1" ;
StringBuffer sb = new StringBuffer() ;
sb.append("<members>") ;
Map map = new HashMap() ;
String d1 = "<member><id>1001</id><name>成员一</name></member><member><id>1002</id><name>成员二</name></member>" ;
String d2 = "<member><id>1003</id><name>成员三</name></member><member><id>1004</id><name>成员四</name></member>" ;
String d3 = "<member><id>1005</id><name>成员五</name></member><member><id>1006</id><name>成员六</name></member>" ;
String d4 = "<member><id>1007</id><name>成员七</name></member><member><id>1008</id><name>成员八</name></member>" ;
map.put("d1",d1) ;
map.put("d2",d2) ;
map.put("d3",d3) ;
map.put("d4",d4) ;
sb.append(map.get(depart.toString())) ;
sb.append("</members>") ;
response.setContentType("text/xml") ;
out.write(sb.toString()) ;
%>
</body>
</html>
posted on 2007-10-13 21:44
Ke 阅读(566)
评论(0) 编辑 收藏 所属分类:
ajax