最近项目需要用到关于省市区三级联动下拉选择的功能，于是乎网上搜了一些做法，觉得有一些只是给出了小的案例，却很难找到详细的省、市、区的具体数据（其实，用baidu搜索就是这样啦），果断用google，搜出来的博文质量相当高，特此记录记录！！！
对于这个效果，其实我发现主要在于两点：1、jquery的筛选遍历操作；2、存储省、市、区这些数据时候的格式。另外一点是如何将获取得到的数据放到select option中（即下拉框中！）
对于第一个问题的解决，其实熟悉Jquery的博友估计是不难的，主要涉及：find，eq，attr等函数的操作。下面是其中涉及到的一个案例：用于获取省的所有数据，并将其放到下拉框中：
function func_suc_getXmlProvice(xml) {
//jquery的查找功能
var sheng = $(xml).find("prov"); //jquery的遍历与查询匹配 eq功能,并将其放到下拉框中
sheng.each(function(i) {
province.append("<option value=" + i + ">"
+ sheng.eq(i).attr("text") + "</option>");
});
}
下面进入正题，建立一个动态web工程，然后将下面讲到的html、js文件、存放省市区xml文件 都放在Web-Contetn下即可。首先看一看前端html文件province_city_select.html：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>省市区三级联动</title>
<script type="text/javascript" src="jquery-1.8.3.min.js"></script>
<script type="text/javascript" src="province_city.js"></script>
</head>
<body>
<select id="province" name="province">
</select>
<select id="city" name="city">
</select>
<select id="area" name="area">
</select>
<div>
地址是：<span id="pro_city"></span> <input id="txtProCity" type="text" />
</div>
</body>
</html>
然后注意放进jquery-1.8.3.min.js，可以来我这里下来：jquery库文件。然后需要新建province_city.js，其源码如下：
$(function() { var address = $("#pro_city");
var province = $("#province");
var city = $("#city");
var area = $("#area");
var preProvince = "<option value="">选择省（市）</option>";
var preCity = "<option value="">选择市（区）</option>";
var preArea = "<option value="">选择区（县）</option>";
//初始化
province.html(preProvince);
city.html(preCity);
area.html(preArea);
