<select id="province">
<option>选择省份</option>
</select>
<select id="city">
<option>选择城市</option>
</select>
<select id="district">
<option>选择区域</option>
</select>
$(document).ready(function(){
var url="${pageContext.request.contextPath}/Provinces.xml?time="+new Date().getTime();
var sendData=null;
$.get(url,sendData,function(xml){
var $xml = $(xml).find("Province");
$xml.each(function(){
var option = $(document.createElement("option"));
option.text($(this).text());
option.attr("name",$(this).attr("ID"));
$("#province").append(option);
})
})
})
$("#province").change(function(){
$("#city option:gt(0)").remove();
$("#district option:gt(0)").remove();
var pid = $("#province option:selected").attr("name");
var url ="${pageContext.request.contextPath}/Cities.xml?time="+new Date().getTime();
var sendData=null;
$.get(url,sendData,function(xml){
var $xml=$(xml).find("City");
$xml.each(function(){
if($(this).attr("PID")==pid){
var option=$(document.createElement("option"));
option.text($(this).text());
option.attr("name",$(this).attr("ID"));
$("#city").append(option);
}
});
});
});
$("#city").change(function(){
$("#district option:gt(0)").remove();
var cid=$("#city option:selected").attr("name");
var url="${pageContext.request.contextPath}/Districts.xml?time="+new Date().getTime();
var sendData=null;
$.get(url,sendData,function(xml){
var $xml= $(xml).find("District");
$xml.each(function(){
if($(this).attr("CID")==cid){
var option=$(document.createElement("option"));
option.text($(this).text());
$("#district").append(option);
}
})
})
})