Js,xml 级联菜单(二)

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> 
<script type="text/javascript"> 
	var xmlDoc = new ActiveXObject("MSXML2.DOMDocument.3.0"); 
	xmlDoc.async = false;
	xmlDoc.load("data.xml");
	var cbNode = xmlDoc.selectNodes("/root/catalogb");
	function init()
	{
		for(var i=0;i<cbNode.length;i++) { 
			var oOption = document.createElement('OPTION'); 
			var catalogb=cbNode[i].getAttribute('text'); 
			oOption.text = " "+catalogb+" "; 
			oOption.value = catalogb; 
			form1.catalogb.options.add(oOption); 
  		} 
	display(); 
	}
	function display() 
	{ 
		var index=form1.catalogb.selectedIndex; 
		form1.cataloga.length=0; 
		var selectedCity = cbNode[index]; 
 		for(var i=0;i<selectedCity.childNodes.length;i++){ 
			var oOption = document.createElement('OPTION'); 
			var cataloga=selectedCity.childNodes[i].getAttribute('text'); 
			oOption.text = " "+cataloga+" "; 
			oOption.value = cataloga; 
			form1.cataloga.options.add(oOption); 
		}
	} 
</script> 
</head> 
<body onload="init()">
<form action="" method="post" id="form1" name="form1"> 
<select name= "catalogb" id="catalogb" onchange="display();" align="center"> 
</select> 
<br> 
<select name= "cataloga" id="cataloga" align="center"> 
</select> 
</form>
</body> 
</html> 


data.xml

<?xml version="1.0" encoding="UTF-8"?>
<root>
	<catalogb id="100" text="古遗址">
		<cataloga id="101" text="洞穴址"/>
		<cataloga id="102" text="聚落址"/>	
		<cataloga id="103" text="城址"/>
		<cataloga id="104" text="窑址"/>          
		<cataloga id="105" text="窑藏址"/> 
		<cataloga id="106" text="矿冶遗址"/> 
		<cataloga id="107" text="古战场"/> 
		<cataloga id="108" text="驿站古道遗址"/>
		<cataloga id="109" text="军事设施遗址"/>
		<cataloga id="110" text="桥梁码头遗址"/>
		<cataloga id="111" text="祭祀遗址"/>
		<cataloga id="112" text="水下遗址"/>
		<cataloga id="113" text="水利设施遗址"/> 
		<cataloga id="114" text="寺庙遗址"/> 
		<cataloga id="115" text="宫殿衙署遗址"/>
		<cataloga id="116" text="其他古遗址"/>      
	</catalogb>
	<catalogb id="200" text="古墓葬">
		<cataloga id="201" text="帝王陵寝"/> 
		<cataloga id="202" text="名人或贵族墓"/> 
		<cataloga id="203" text="普通墓葬"/> 
		<cataloga id="204" text="其他古墓葬"/> 
	</catalogb>
	<catalogb id="300" text="古建筑">
		<cataloga id="301" text="城垣城楼"/>
		<cataloga id="302" text="宫殿府邸"/>
		<cataloga id="303" text="宅第民居"/>
		<cataloga id="304" text="坛庙祠堂"/>
		<cataloga id="305" text="衙署官邸"/>
		<cataloga id="306" text="学堂书院"/>
		<cataloga id="307" text="驿站会馆"/>
		<cataloga id="308" text="店铺作坊"/>
		<cataloga id="309" text="牌坊影壁"/>
		<cataloga id="310" text="亭台楼阙"/>
		<cataloga id="311" text="寺观塔幢"/>
		<cataloga id="312" text="苑囿园林"/>
		<cataloga id="313" text="桥涵码头"/>
		<cataloga id="314" text="堤坝渠堰"/>
		<cataloga id="315" text="池塘井泉"/>
		<cataloga id="316" text="其他古建筑"/>
	</catalogb>
	<catalogb id="400" text="石窟寺及石刻">
		<cataloga id="401" text="石窟寺"/>
		<cataloga id="402" text="摩崖石刻"/>
		<cataloga id="403" text="碑刻"/>
		<cataloga id="404" text="石雕"/>
		<cataloga id="405" text="岩画"/>
		<cataloga id="406" text="其他石刻"/>
	</catalogb>
	<catalogb id="500" text="近现代重要史迹及代表性建筑">
		<cataloga id="501" text="重要历史事件和重要机构旧址"/>
		<cataloga id="502" text="重要历史事件及人物活动纪念地"/>
		<cataloga id="503" text="名人故、旧居"/>
		<cataloga id="504" text="传统民居"/>
		<cataloga id="505" text="宗教建筑"/>
		<cataloga id="506" text="名人墓"/>
		<cataloga id="507" text="烈士墓及纪念设施"/>
		<cataloga id="508" text="工业建筑及附属物"/>
		<cataloga id="509" text="金融商贸建筑"/>
		<cataloga id="510" text="中华老字号"/>
		<cataloga id="511" text="水利设施及附属物"/>
		<cataloga id="512" text="文化教育建筑及附属物"/>
		<cataloga id="513" text="医疗卫生建筑"/>
		<cataloga id="514" text="军事建筑及设施"/>
		<cataloga id="515" text="交通道路设施"/>
		<cataloga id="516" text="典型风格建筑或构筑物"/>
		<cataloga id="517" text="其他近现代重要史迹及代表性建筑"/>
	</catalogb>
	<catalogb id="600" text="其他">
		<cataloga id="601" text="其他"/>
	</catalogb>
</root>

你可能感兴趣的:(java,html,jsp,xml)