ajax实例--responseXML三级联动(未完全实现版)
来源:互联网 发布:安卓防蓝光软件哪个好 编辑:程序博客网 时间:2024/05/16 14:12
<%@ page language="java" pageEncoding="utf-8"%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html><head><title>级联菜单</title><script charset="gb2312" type="text/javascript" src="./xmFile.js"> </script></head><body> <select id="province" name="province"> <option value="">请选择....</option> </select> <select id="city" name="city"> <option value="">请选择.....</option> </select> </body></html>
function ajaxFunction(){ var xmlHttp; try{ // Firefox, Opera 8.0+, Safari xmlHttp=new XMLHttpRequest(); } catch (e){ try{// Internet Explorer xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); } catch (e){ try{ xmlHttp=new ActiveXObject("Microsoft.XMLHTTP"); } catch (e){} } } return xmlHttp; }window.onload = function(){ //获取XMLHttpRequest对象var xmlRequest=ajaxFunction();//注册事件xmlRequest.onreadystatechange=function(){if(xmlRequest.readyState==4){if(xmlRequest.status==200||xmlRequest.status==304){ var xmlDoc=xmlRequest.responseXML; alert(xmlDoc); /* * <china><province name="吉林省"><city>长春</city></province><province name="辽宁省"><city>沈阳</city></province><province name="山东省"><city>济南</city></province> </china> */ var provinceElements=xmlDoc.getElementsByTagName("province"); //alert(provinceElements.length); for(var i=0;i<provinceElements.length;i++){ var provinceElement=provinceElements[i]; var namevalue=provinceElement.getAttribute("name"); //alert(namevalue); var optionElement=document.createElement("option"); optionElement.setAttribute("value",namevalue); var textElement=document.createTextNode(namevalue); optionElement.appendChild(textElement); /* * <select id="province" name="province"> <option value="">请选择....</option> </select> */document.getElementById("province").appendChild(optionElement); }}}}//打开连接xmlRequest.open("post","../xmlFileServlet?timeStamp="+new Date().getTime(),true);xmlRequest.setRequestHeader("Content-Type","application/x-www-form-urlencoded")//发送请求 xmlRequest.send(null);}
package cn.ajax;import java.io.IOException;import java.io.PrintWriter;import javax.servlet.ServletException;import javax.servlet.http.HttpServlet;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse;public class XmlFileServlet extends HttpServlet {public void doGet(HttpServletRequest request, HttpServletResponse response)throws ServletException, IOException {}public void doPost(HttpServletRequest request, HttpServletResponse response)throws ServletException, IOException {request.setCharacterEncoding("utf-8");//生成一个xml文件response.setContentType("text/xml;charset=utf-8");PrintWriter out = response.getWriter();out.println("<china>");out.println("<province name='吉林省'>");out.println("<city>长春</city>");out.println("<city>吉林市</city>");out.println("<city>四平</city>");out.println("<city>松原</city>");out.println("<city>通化</city>");out.println("</province>");out.println("<province name='辽宁省'>");out.println("<city>沈阳</city>");out.println("<city>大连</city>");out.println("<city>鞍山</city>");out.println("<city>抚顺</city>");out.println("<city>铁岭</city>");out.println("</province>");out.println("<province name='山东省'>");out.println("<city>济南</city>");out.println("<city>青岛</city>");out.println("<city>威海</city>");out.println("<city>烟台</city>");out.println("<city>潍坊</city>");out.println("</province>");out.println("</china>");}}