省市县三级连动三种实现方式（javascript+jsp+servlet）、（jquery+jsp+servlet）、（extjs4.0+jsp+servle）
方法一：（纯javascript+jsp+servlet）
<script type="text/javascript">var request = getRequest();function getRequest(){var request;if(window.XMLHttpRequest){request = new XMLHttpRequest();//alert("xmlRequestHttp");}else{request = new ActiveXObject("Microsoft.XMLHTTP");alert("xobject");}return request;}function fun_init(){//alert("init");var url = '<%=request.getContextPath()%>/CityLinkServlet?level=1';request.open('POST',url,true);request.onreadystatechange = show_province;request.send(null);}function change_province(_level,_code){//alert(_level);var url = '<%=request.getContextPath()%>/CityLinkServlet?level='+_level+'&code='+_code;request.open('POST',url,true);request.onreadystatechange = show_city;request.send(null);}function change_city(_level,_code){//alert(_level);var url = '<%=request.getContextPath()%>/CityLinkServlet?level='+_level+'&code='+_code;request.open('POST',url,true);request.onreadystatechange = show_county;request.send(null);}function show_province(){if(request.readyState == 4){if(request.status == 200){var ret = request.responseText;var jsonObj = eval("("+ret+")");//alert(jsonObj.data.length);//alert(document.getElementById("province"));var obj = document.getElementById("province");for(var i=0;i<jsonObj.length;i++){var item = new Option(jsonObj[i].name,jsonObj[i].code);obj.options.add(item);}}}}function show_city(){if(request.readyState == 4){if(request.status == 200){var ret = request.responseText;var jsonObj = eval("("+ret+")");var obj = document.getElementById("city");obj.options.length = 1;for(var i=0;i<jsonObj.length;i++){var item = new Option(jsonObj[i].name,jsonObj[i].code);obj.options.add(item);}}}}function show_county(){//alert(request);if(request.readyState == 4){if(request.status == 200){var ret = request.responseText;var jsonObj = eval("("+ret+")");var obj = document.getElementById("county");obj.options.length = 1;for(var i=0;i<jsonObj.length;i++){var item = new Option(jsonObj[i].name,jsonObj[i].code);obj.options.add(item); }//alert(jsonObj.data.length);}}}</script></head><body onload="fun_init()"><div><label>省</label><select id="province" onchange="change_province(2,this.value)"><option value="--">---请选择---</option></select><br/><label>市</label><select id="city" onchange = "change_city(3,this.value)"><option value="--">---请选择---</option></select><br/><label>县</label><select id="county"><option value="--">---请选择---</option></select><br/></div></body></html>?
方法二：（jquery+jsp+servlet）
<script type="text/javascript" src="<%=request.getContextPath()%>/jquery/jquery-1.7.1.js"></script><script type="text/javascript">$(function(){var $province = $("#province");var $city = $("#city");var $county = $("#county");//省份选择框变化处理函数$province.change(function(){//alert($province.val());$city[0].options.length = 1;$county[0].options.length = 1;$.ajax({type:'post',url:'<%=request.getContextPath()%>/CityLinkServlet',dataType:'json',data:{level:'2',code:$province.val()},success:function(ret){$.each(ret,function(){$city.append("<option value="+this.code+">"+this.name+"</option>");});},error:function(){alert("出现未知故障");}});});//市选择框变化处理函数$city.change(function(){//alert($city.val());$county[0].options.length = 1;$.ajax({type:'post',url:'<%=request.getContextPath()%>/CityLinkServlet',dataType:'json',data:{level:'3',code:$city.val()},success:function(ret){$.each(ret,function(){$county.append("<option value="+this.code+">"+this.name+"</option>");});},error:function(){alert("出现未知故障");}});});//页面加载完毕查询省份信息$.ajax({type:"post",url:"<%=request.getContextPath()%>/CityLinkServlet",data:{level:"1"},dataType:"json",success:function(ret){$.each(ret,function(){$province.append("<option value="+this.code+">"+this.name+"</option>");});},error:function(){alert("出现未知故障");}});});</script></head><body><div><label>省</label><select id="province"><option value="--">---请选择---</option></select><br/><label>市</label><select id="city"><option value="--">---请选择---</option></select><br/><label>县</label><select id="county"><option value="--">---请选择---</option></select><br/></div></body></html>?方法三：（extjs4.0+jsp+servlet）
<%String conPath = request.getContextPath(); %><link href="<%=conPath %>/extjs4.0/resources/css/ext-all.css" rel="stylesheet" type="text/css"><script type="text/javascript" src="<%=conPath%>/extjs4.0/ext-all.js"></script><script type="text/javascript" src="<%=conPath%>/extjs4.0/ext-lang-zh_CN.js"></script><script type="text/javascript">Ext.require("Ext.*");Ext.onReady(function(){//定义combox模型Ext.define('State',{extend:'Ext.data.Model',fields:[ {type:'string',name:'code'}, {type:'string',name:'name'} ]});//加载省数据源var province_store = Ext.create('Ext.data.Store',{model:'State',proxy:{type:'ajax',url:'<%=request.getContextPath()%>/CityLinkServlet?level=1'},autoLoad:true,remoteSort:true});//加载市数据源var city_store = Ext.create('Ext.data.Store',{model:'State',proxy:{type:'ajax',url:'<%=request.getContextPath()%>/CityLinkServlet?level=2'},autoLoad:false,remoteSort:true});//加载县数据源var county_store = Ext.create('Ext.data.Store',{model:'State',proxy:{type:'ajax',url:'<%=request.getContextPath()%>/CityLinkServlet?level=3'},autoLoad:false,remoteSort:true});//创建显示面板Ext.create('Ext.panel.Panel',{renderTo:document.body,width:300,height:220,title:'省市县三级联动',plain:true,margin:'30 10 50 80',bodyStyle:'padding:45px,15px,15px,15px',defaults:{autoScroll:true,bodyPadding:10},items:[{xtype:'combo',name:'province',id:'province',fieldLabel:'选择省',displayField:'name',valueField:'code',store:province_store,triggerAction:'all',queryMode:'local',//selectOnFocus:true,forceSelection:true,allowBlank:false,editable:false,emptyText:'--请选择省--',blankText:'--请选择省--',listeners:{select:function(combo,record,index){//alert(this.value);try{var cityObj = Ext.getCmp('city');cityObj.clearValue();cityObj.store.load({params:{code:this.value}});}catch(ex){Ext.MessageBox.alert("错误","数据加载失败");}}}}, {xtype:'combo',name:'city',id:'city',fieldLabel:'选择市',displayField:'name',valueField:'code',store:city_store,triggerAction:'all',queryMode:'local',//selectOnFocus:true,forceSelection:true,allowBlank:false,editable:false,emptyText:'--请选择市--',blankText:'--请选择市--',listeners:{select:function(combo,record,index){try{var countyObj = Ext.getCmp('county');countyObj.clearValue();countyObj.store.load({params:{code:this.value}});}catch(ex){Ext.MessageBox.alert("错误","数据加载失败");}}} }, { xtype:'combo',name:'county',id:'county',fieldLabel:'选择县',displayField:'name',valueField:'code',store:county_store,triggerAction:'all',queryMode:'local',//selectOnFocus:true,forceSelection:true,allowBlank:false,editable:false,emptyText:'--请选择县--',blankText:'--请选择县--' }]});});</script></head><body></body></html>?后台代码：
package com.servlet;import java.io.IOException;import java.sql.Connection;import java.sql.PreparedStatement;import java.sql.ResultSet;import java.sql.SQLException;import javax.servlet.ServletException;import javax.servlet.http.HttpServlet;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse;import org.json.JSONArray;import org.json.JSONException;import org.json.JSONObject;import com.util.DBUtil;/** * Servlet implementation class CityLink */public class CityLinkServlet extends HttpServlet{ private static final long serialVersionUID = 1L; @Override protected void service(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { System.out.println("----in ---service"); String level = request.getParameter("level"); System.out.println("level=========="+level); String code = request.getParameter("code"); System.out.println("code========"+code); String sql = null; if ("1".equals(level)) { sql = "select dm,mc from city where dm like '%0000' order by dm"; deal(sql, response); } else if ("2".equals(level)) { sql = "select dm,mc from city where dm like '" + code.substring(0, 2) + "%00' and dm != '" + code + "' order by dm"; deal(sql, response); } else if ("3".equals(level)) { sql = "select dm,mc from city where dm like '" + code.substring(0, 4) + "%' and dm != '" + code + "' order by dm"; deal(sql, response); } else { } } public void deal(String sql, HttpServletResponse response) { Connection conn = DBUtil.getConnection(); ResultSet rs = null; PreparedStatement pst = null; try { pst = conn.prepareStatement(sql); rs = pst.executeQuery(); JSONArray jsonArray = new JSONArray(); JSONObject jsonObject = null; int i = 0; while (rs.next()) { jsonObject = new JSONObject(); jsonObject.put("code", rs.getString(1)).put("name", rs.getString(2)); jsonArray.put(i++, jsonObject); } JSONObject jsonObject2 = new JSONObject(); jsonObject2.put("data", jsonArray); response.setCharacterEncoding("utf-8"); response.getWriter().println(jsonArray); //response.getWriter().println(jsonObject2); System.out.println(jsonArray.toString()); } catch (SQLException e) { e.printStackTrace(); } catch (JSONException e) { e.printStackTrace(); } catch (IOException e) { e.printStackTrace(); } finally { DBUtil.close(conn, pst, rs); } }}?DButil。java
package com.util;import java.sql.Connection;import java.sql.DriverManager;import java.sql.PreparedStatement;import java.sql.ResultSet;import java.sql.SQLException;import java.sql.Statement;import java.util.ResourceBundle;public class DBUtil{ private static String driverClassName ; private static String username; private static String password; private static String url; private static ResourceBundle bundle = ResourceBundle.getBundle("jdbc-mysql"); static{ driverClassName = bundle.getString("driverClassName").trim(); username = bundle.getString("username").trim(); password = bundle.getString("password").trim(); url = bundle.getString("url").trim(); try { Class.forName(driverClassName); } catch (ClassNotFoundException e) { // TODO Auto-generated catch block System.out.println("找不到jdbc驱动包"); e.printStackTrace(); } } public static Connection getConnection(){ Connection conn = null; try { conn = DriverManager.getConnection(url, username, password); } catch (SQLException e) { // TODO Auto-generated catch block e.printStackTrace(); } return conn; } public static void close(Connection conn){ if(conn!=null){ try { conn.close(); } catch (SQLException e) { // TODO Auto-generated catch block e.printStackTrace(); conn = null; } conn = null; } } public static void close(Statement stmt){ if(stmt!=null){ try { stmt.close(); } catch (SQLException e) { // TODO Auto-generated catch block e.printStackTrace(); stmt = null; } stmt = null; } } public static void close(PreparedStatement pst){ if(pst!=null){ try { pst.close(); } catch (SQLException e) { // TODO Auto-generated catch block e.printStackTrace(); pst = null; } pst = null; } } public static void close(ResultSet rs){ if(rs!=null){ try { rs.close(); } catch (SQLException e) { // TODO Auto-generated catch block e.printStackTrace(); rs = null; } rs = null; } } public static void close(Connection conn,java.sql.PreparedStatement stmt){ close(stmt); close(conn); } public static void close(Connection conn,java.sql.PreparedStatement pst,ResultSet rs){ close(rs); close(pst); close(conn); } public static void close(Connection conn,Statement stmt){ close(stmt); close(conn); } public static void close(Connection conn,Statement stmt,ResultSet rs){ close(rs); close(stmt); close(conn); } }?