xml数据二级联动

2019-11-14 11:46:31

字体：大中小

来源：转载

供稿：网友

package domain;import com.thoughtworks.xstream.annotations.XStreamAsAttribute;public class City {	@XStreamAsAttribute	PRivate String name;	@XStreamAsAttribute	private int code;	public City() {	}	public City(String name, int code) {		super();		this.name = name;		this.code = code;	}	public String getName() {		return name;	}	public void setName(String name) {		this.name = name;	}	public int getCode() {		return code;	}	public void setCode(int code) {		this.code = code;	}}package domain;import java.util.ArrayList;import java.util.List;import com.thoughtworks.xstream.annotations.XStreamAlias;import com.thoughtworks.xstream.annotations.XStreamAsAttribute;import com.thoughtworks.xstream.annotations.XStreamImplicit;@XStreamAlias("Shengfen")public class Shengfen {	@XStreamAsAttribute() // 这里就是把name和code座位省份的属性来显示，并不是子接点	private String name;	@XStreamAsAttribute()	private int code;	@XStreamImplicit(itemFieldName = "CiTy")	List<City> cities = new ArrayList<City>();	public Shengfen() {	}	public Shengfen(String name, int code) {		super();		this.name = name;		this.code = code;	}	public String getName() {		return name;	}	public void setName(String name) {		this.name = name;	}	public int getCode() {		return code;	}	public void setCode(int code) {		this.code = code;	}	public List<City> getCities() {		return cities;	}	public void setCities(List<City> cities) {		this.cities = cities;	}}package test_main;import java.io.IOException;import java.util.ArrayList;import java.util.List;import javax.servlet.ServletException;import javax.servlet.http.HttpServlet;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse;import com.thoughtworks.xstream.XStream;import domain.City;import domain.Shengfen;/** * Servlet implementation class xml5 */public class XML5 extends HttpServlet {	private static final long serialVersionUID = 1L;	protected void doGet(HttpServletRequest request, HttpServletResponse response)			throws ServletException, IOException {		List<Shengfen> shengfens = new ArrayList<Shengfen>();		// 添加省份		Shengfen zj = new Shengfen("浙江", 1);		Shengfen ah = new Shengfen("安徽", 2);		Shengfen sh = new Shengfen("上海", 3);		// 为省份添加城市		zj.getCities().add(new City("杭州", 1));		zj.getCities().add(new City("宁波", 2));		zj.getCities().add(new City("台州", 3));		ah.getCities().add(new City("合肥", 1));		ah.getCities().add(new City("阜阳", 2));		ah.getCities().add(new City("芜湖", 3));		sh.getCities().add(new City("松江", 1));		sh.getCities().add(new City("黄埔", 2));		sh.getCities().add(new City("外滩", 3));		// 在省份shengfens的list里面添加这三个省份		shengfens.add(sh);		shengfens.add(ah);		shengfens.add(zj);		XStream xstream = new XStream();		xstream.autodetectAnnotations(true);		xstream.alias("ShengFen", List.class);		String xml = xstream.toXML(shengfens);		// 输出xml文件		response.setContentType("text/xml;charset=utf-8");		response.getWriter().write(xml);	}	/**	 * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse	 *      response)	 */	protected void doPost(HttpServletRequest request, HttpServletResponse response)			throws ServletException, IOException {		// TODO Auto-generated method stub		doGet(request, response);	}}<%@ page language="java" contentType="text/html; charset=UTF-8"    pageEncoding="UTF-8"%><!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"><script type="text/Javascript" src="jutil.js"></script><script type="text/javascript">/* *  <ShengFen> <Shengfen name="上海" code="3">   <CiTy name="松江" code="1"/>   <CiTy name="黄埔" code="2"/>   <CiTy name="外滩" code="3"/> </Shengfen> <Shengfen name="安徽" code="2">   <CiTy name="合肥" code="1"/>   <CiTy name="阜阳" code="2"/>   <CiTy name="芜湖" code="3"/> </Shengfen> <Shengfen name="浙江" code="1">   <CiTy name="杭州" code="1"/>   <CiTy name="宁波" code="2"/>   <CiTy name="台州" code="3"/> </Shengfen></ShengFen> */	 var xmlDoc	;	window.onload=function(){		//发出异步请求		var xhr=getXHR();		xhr.onreadystatechange=function(){			if(xhr.readyState==4){				if(xhr.status==200){					 xmlDoc=xhr.responseXML;										//-----------------------------------//					//给省份赋值 xml dom 和html dom					//1.解析xml文档，得到省份元素					var xmlShengfen=xmlDoc.getElementsByTagName("Shengfen");					//2.遍历省份元素					for(var i=0;i<xmlShengfen.length;i++){											//3.创建html中的select中的option选项					var codeValue=xmlShengfen[i].getAttribute("code");					var nameValue=xmlShengfen[i].getAttribute("name");											//向select标签中添加option内容					var o=new Option(nameValue,codeValue);					document.getElementById("s1").add(o);					}									}							}		}		xhr.open("GET","XML5?time="+new Date().getTime());		xhr.send(null);			}	//省份变化，激活该函数，给城市选项相应的option	function change(Shengfen){		//获取当前省份选项的value值		var SelectValue=Shengfen.value;			//清楚城市的下拉选项		document.getElementById("c1").length=1;		//遍历xml中的省份信息，比对code的值		//先要获取的所有的省份		var xmlShengfen=xmlDoc.getElementsByTagName("Shengfen");		//遍历		for(var j=0;j<xmlShengfen.length;j++){			if(SelectValue==xmlShengfen[j].getAttribute("code")){				//获取该省份下面的城市的信息				var xmlCity=xmlShengfen[j].getElementsByTagName("CiTy");				//上面获取的是CiTy元素的内容（就是一个数组）				for(var i=0;i<xmlCity.length;i++){					//给城市选选项框内容赋值				var o=new Option(xmlCity[i].getAttribute("name"),xmlCity[i].getAttribute("code"));					document.getElementById("c1").add(o);				}							}					}				}</script><title>省市二级联动</title></head><body>省份：	<select id="s1" onchange="change(this)">		<option>--请选择--</option>		</select>城市：<select id="c1">		<option>--请选择--</option>	</select></body></html>