<html>
<head>
<META http-equiv=Content-Type content="text/html; charset=gb2312">
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script>
(function($){
$.fn.selInit = function(){return $(this).html("<option>请选择</option>");};
$.area = function(){
$("#province").selInit();
$("#city").selInit();
$("#county").selInit();
var area = {
北京:{北京:"东城,西城,海淀,宣武,丰台"},
江苏:{南京:"江宁,六合,下关,浦口",无锡:"北塘,滨湖,江阴,宜兴"}
//
};
$.each(area,function(p){$("#province").append("<option>"+p+"</option>");});
$("#province").change(function(){
$("#city").selInit();
$("#county").selInit();
$.each(area,function(p,x){
if($("#province option:selected").text() == p)
{
$.each(x,function(c,cx){
$("#city").append("<option>"+c+"</option>");
});
$("#city").bind("change",function(){
$("#county").selInit();
$.each(x,function(c,cx){
if($("#city option:selected").text() == c)
{
$.each(cx.split(","),function(){
$("#county").append("<option>"+this+"</option>");
});
}
});
});
}
});
});
};
})(jQuery);
$(function(){
$("select").css("width","100px");
$.area();
});
</script>
</head>
<body>
<select id="province"><option>请选择</option></select>
<select id="city"><option>请选择</option></select>
<select id="county"><option>请选择</option></select>
</body>
</html>
发布于：2015年12月31日
已被阅读次