通过AJAX实现三级下拉框查询省市等

最新推荐文章于 2023-05-22 22:27:23 发布

linwei_1029

最新推荐文章于 2023-05-22 22:27:23 发布

阅读量2.1k

点赞数 1

分类专栏： AJAX知识文章标签： ajax function url null html stylesheet

本文链接：https://blog.csdn.net/linwei_1029/article/details/6237469

版权

AJAX知识专栏收录该内容

3 篇文章 0 订阅

订阅专栏

1. 一个单独的测试界面:

<%@ 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> <base href="<%=basePath%>"> <title>My JSP 'new.jsp' starting page</title> <meta http-equiv="pragma" content="no-cache"> <meta http-equiv="cache-control" content="no-cache"> <meta http-equiv="expires" content="0"> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="This is my page">  <mce:script type="text/javascript" src="resources/jquery.js" mce_src="resources/jquery.js"></mce:script> </head> <body> <select id="Select1" name="Select1" οnchange="selectProvince();"></select> <select id="Select2" name="Select2" οnchange="selectArea();"></select> <select id="Select3" name="Select3"></select> </body> </html> <mce:script type="text/javascript"></mce:script>

2. servlet

package service; import java.io.ByteArrayOutputStream; import java.io.IOException; import java.io.InputStream; import java.io.PrintWriter; import javax.servlet.ServletException; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import upload.FileOperation; public class XmlForAJAX extends HttpServlet { /** * Constructor of the object. */ public XmlForAJAX() { super(); } /** * Destruction of the servlet. <br> */ public void destroy() { super.destroy(); // Just puts "destroy" string in log // Put your code here } /** * The doGet method of the servlet. <br> * * This method is called when a form has its tag value method equals to get. * * @param request the request send by the client to the server * @param response the response send by the server to the client * @throws ServletException if an error occurred * @throws IOException if an error occurred */ public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setContentType("text/html"); PrintWriter out = response.getWriter(); out .println("<!DOCTYPE HTML PUBLIC /"-//W3C//DTD HTML 4.01 Transitional//EN/">"); out.println("<HTML>"); out.println(" <HEAD><TITLE>A Servlet</TITLE></HEAD>"); out.println(" <BODY>"); out.print(" This is "); out.print(this.getClass()); out.println(", using the GET method"); out.println(" </BODY>"); out.println("</HTML>"); out.flush(); out.close(); } /** * The doPost method of the servlet. <br> * * This method is called when a form has its tag value method equals to post. * * @param request the request send by the client to the server * @param response the response send by the server to the client * @throws ServletException if an error occurred * @throws IOException if an error occurred */ public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setHeader("Content-Type","text/xml; charset=UTF-8"); PrintWriter out = response.getWriter(); FileOperation f = new FileOperation(); String str = ""; try { InputStream in = f.getResourceAsStream("service/area.xml"); /* if(in != null) { System.out.println("不是空的"); } else { System.out.println("是空的。"); }*/ int i = -1; ByteArrayOutputStream bis = new ByteArrayOutputStream(); while((i = in.read()) != -1) { bis.write(i); } //System.out.println(bis.toString("UTF-8")); out.print(bis.toString("UTF-8")); } catch (Exception e) { // TODO Auto-generated catch block e.printStackTrace(); } /* StringBuffer bf = new StringBuffer(); bf.append("<?xml version=/"1.0/" encoding=/"UTF-8/"?>") .append("<stulist>").append("<student email=/"1@1.com/">").append("<name>zhangsan</name>").append("<id>1</id>") .append("</student>").append("<student email=/"2@2.com/">").append("<name>lisi</name>").append("<id>2</id>") .append("</student>").append("</stulist>"); System.out.println(bf.toString()); out.print(bf.toString());*/ out.flush(); out.close(); } /** * Initialization of the servlet. <br> * * @throws ServletException if an error occurs */ public void init() throws ServletException { // Put your code here } }

3. XML文件,可以按照以下格式多添加几个市

<?xml version="1.0" encoding="UTF-8"?> <root name="中国"> <province name="北京" postcode="beijing" index="1" id="1"> <city name="北京" postcode="100000" index="1"> <area name="北京市" postcode="100000" price="1" index="1"/> <area name="门头沟区" postcode="102300" index="2"/> <area name="房山区" postcode="102400" index="3"/> <area name="顺义区" postcode="101300" index="4"/> <area name="通州区" postcode="101100" index="5"/> <area name="昌平区" postcode="102200" index="6"/> <area name="密云县" postcode="101500" index="7"/> <area name="延庆县" postcode="102100" index="8"/> <area name="大兴县" postcode="102600" index="9"/> <area name="怀柔县" postcode="101400" index="10"/> <area name="平谷县" postcode="101200" index="11"/> </city> </province> </root>