jquery+xml省市区联动
场景：全新无bug的jquery+xml省市区三级联动，非常好用，真的非常好用，这次真的把所有的bug都修改了,该怎么处理
全新无bug的jquery+xml省市区三级联动，非常好用，真的非常好用，这次真的把所有的bug都修改了
使用规则：
1、放在IIS下浏览
2、遵守中华人民共和国有关法律法规使用
3、本着人人为我，我为人人的观念，这次下载需要1积分，你也可以下载老版本的去自己修改（哈哈）
4、要是不兼容任何一款浏览器，你们来骂我
注：
请务必放在IIS下浏览，不然会出现“fail”，或者你直接用VS环境运行也可以的
修正多个Bug优美的jquery+xml城市3级联动效果（放在IIS下运行） 下载
------解决方案--------------------
先顶下，再下载用一下
------解决方案--------------------
多谢分享
下载啦
------解决方案--------------------
希望这次不会出线不兼容，强烈建议LZ把样式也改一下太土气啦。
------解决方案--------------------
哈哈哈哈哈,和我写的差不多.支持
------解决方案--------------------
又来了， 向楼主专业精神致敬
------解决方案--------------------
楼主推动了中国软件业的进步啊
------解决方案--------------------
真不错。收了。
------解决方案--------------------
good !!
------解决方案--------------------
我 收了
------解决方案--------------------
全新无bug的jquery+xml省市区三级联动，非常好用，真的非常好用，这次真的把所有的bug都修改了
使用规则：
1、放在IIS下浏览
2、遵守中华人民共和国有关法律法规使用
3、本着人人为我，我为人人的观念，这次下载需要1积分，你也可以下载老版本的去自己修改（哈哈）
4、要是不兼容任何一款浏览器，你们来骂我
注：
请务必放在IIS下浏览，不然会出现“fail”，或者你直接用VS环境运行也可以的
修正多个Bug优美的jquery+xml城市3级联动效果（放在IIS下运行） 下载
- HTML code
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>3级联动</title>
<script src="jquery.js" type="text/javascript"></script>
<style type="text/css">
.ddldisplay{ float:left;height:27px;position:relative; cursor:pointer; top:0px; left:0px; font-size:12px; margin-right:10px;}
.ddldisplay span{ padding-left:5px;height:27px; line-height:27px; top:200px; left:0px;}
.ddldisplay div{ display:none; position:absolute; top:27px; left:0px;border:1px solid #bfbfbf; border-top:none; width:280px; height:auto; overflow:hidden; background:#ffffff;}
.ddldisplay div a{ display:block; padding-left:5px;height:20px; line-height:20px; color:#666; text-decoration:none; background:#ffffff; float:left; width:60px;}
.ddldisplay div a:hover{ color:Blue; text-decoration:underline;}
.ddlShouhuo{width:101px;background:url(ddlAdderss.gif) no-repeat;}
#ddlQu div{width:140px; border-top:1px solid #d2d2d2;}
#ddlShi div{width:140px;}
ul,li,table,h1,h2,h3,h4,h5,h6,img{ list-style:none; margin:0px; padding:0px;}
body{ margin:0; padding:0; color:#5a5a5a;}
</style>
</head>
<body>
<form id="form1">
<div>
<div class="ddlShouhuo ddldisplay" id="ddlSheng">
<span id="txtSheng">(省/直辖市)</span>
<div></div>
</div>
<div class="ddlShouhuo ddldisplay" id="ddlShi">
<span id="txtShi">(地区/市)</span>
<div></div>
</div>
<div class="ddlShouhuo ddldisplay" id="ddlQu">
<span id="txtqu">(区/县)</span>
<div></div>
</div>
</div>
</form>
</body>
</html>
<script type="text/javascript">
$(document).ready(function(){
cityArea();
$('.ddldisplay').hover(
function(){return false;},
function(){$(this).children("div").hide();$('.ddldisplay').toggle(
function() { $(this).children("div").show(); },
function() { $(this).children("div").hide(); }
);}
);
});
function cityArea() {
$.ajax({
url: "Area.xml", //地址
type: "GET",
dataType: "xml",
error: function(xdata) { alert("fail:"); },
success: function(xdata) {
var sheng,shi,qu;
sheng = $("#ddlSheng");
shi = $("#ddlShi");
qu = $("#ddlQu");
if ($(xdata) != null) {
$(sheng).find("div").html("");
for (var i = 0; i < $(xdata).find("address > province").length; i++) {
$(sheng).find("div").append("<a href='javascript:;'>" + $(xdata).find("address > province:eq(" + i + ")").attr("name") + "</a>"); ;
}
}
//下面是下拉框
$(".ddldisplay").toggle(
function() { $(this).children("div").show(); },
function() { $(this).children("div").hide(); }
);
$(sheng).find("a").click(function() {
$(sheng).find("span").text($(this).text());
var provinceName = $(this).text();
//清空市和区的列表，以免重复添加
$(shi).find("div").html("");
$(qu).find("div").html("");
//根据省查找该省的所有下级市，市下所有区
for (var i = 0; i < $(xdata).find("address > province[name='" + provinceName + "'] > city").length; i++) {
$(shi).find("div").append("<a href='javascript:;'>" + $(xdata).find("address > province[name='" + provinceName + "'] > city:eq(" + i + ")").attr("name") + "</a>");
}
for (var i = 0; i < $(xdata).find("address > province[name='" + $(this).text() + "'] > city[name='"+$(shi).find("div a:eq(0)").text()+"'] > country").length; i++) {
var txt = $(xdata).find("address > province[name='" + $(this).text() + "'] > city[name='"+$(shi).find("div a:eq(0)").text()+"'] > country:eq("+i+")").attr("name");
$(qu).find("div").append("<a href='javascript:;'>" + txt + "</a>");
}
$(qu).find("a").click(function() {
$(qu).find("span").text($(this).text());
});
//隐藏列表
$(this).parents(".ddldisplay").find("div").hide();
$(shi).find("span").text($(shi).find("div a:eq(0)").text());
$(qu).find("span").text($(qu).find("div a:eq(0)").text());
$(shi).find("a").click(function() {
var provinceName = $(sheng).find("span").text(); //省
var cityName = $(this).text(); //市
$(shi).find("span").text(cityName);
var country = $(xdata).find("address > province[name='" + provinceName + "'] > city[name='" + cityName + "'] > country");
var len = country.length;
$(qu).find("div").html("");
for (var i = 0; i < len; i++) {
var countryName = $(xdata).find("address > province[name='" + provinceName + "'] > city[name='" + cityName + "'] > country:eq(" + i + ")").attr("name");
$(qu).find("div").append("<a href='javascript:;'>" + countryName + "</a>");
}
//隐藏列表
$(this).parents(".ddldisplay").find("div").hide();
$(qu).find("span").text($(qu).find("div a:eq(0)").text());
$(qu).find("a").click(function() {
$(qu).find("span").text($(this).text());
});
});
});
}
});
}
</script>
------解决方案--------------------
先顶下，再下载用一下
------解决方案--------------------
多谢分享
下载啦
------解决方案--------------------
希望这次不会出线不兼容，强烈建议LZ把样式也改一下太土气啦。
------解决方案--------------------
哈哈哈哈哈,和我写的差不多.支持
------解决方案--------------------
又来了， 向楼主专业精神致敬
------解决方案--------------------
楼主推动了中国软件业的进步啊
------解决方案--------------------
真不错。收了。
------解决方案--------------------
good !!
------解决方案--------------------
我 收了
------解决方案--------------------