<body>
<div id="zhuti"></div>
</body>
<script type="text/javascript">
$(document).ready(function(e) {
//建主体框架，建立三个下拉菜单，分别显示省、市、区（县）
var zhuti="<select id='sheng'></select><select id='shi'></select><select id='qu'></select>";
//将主体内容显示在页面中
$("#zhuti").html(zhuti);
//填充省表单
FillSheng();
//填充市表单
FillShi();
//填充区（县）表单
FillQu();
//当选择省时，后两个菜单中只显示相对应的市、区（县）
$("#sheng").change(function(){
//填充市表单
FillShi();
//填充区（县）表单
FillQu();
})
//当市被选中时，后一个菜单中只显示相对应的区（县）
$("#shi").change(function(){
//填充区（县）表单
FillQu();
})
});
//填充省的方法
function FillSheng()
{
//需要用到省的父级代号
var pcode="0001";
//调用AJAX方法
$.ajax({
async:false, //关闭异步执行，开启同步执行，默认为true，开启异步执行
url:"cxchuli.php", //引用处理页面
data:{pcode:pcode}, //传递值
type:"POST", //传值方式
dataType:"TEXT", //返回数据格式
success: function(data){
//对返回的字符串进行去空格拆分，得到一个行的数组
var hang=data.trim().split("|");
//初始化变量为空
var str="";
//对数组进行循环遍历
for(var i=0;i<hang.length;i++)
{
//对每行的数据进行去空格拆分，得到一个列的数组
var lie= hang[i].trim().split("^");
//将数据进行拼接存入变量中
str=str+"<option value='"+lie[0]+"'>"+lie[1]+"</option>";
}
//将得到的数据放到省级下拉菜单中显示
$("#sheng").html(str);
}
})
}
填充市的方法
function FillShi()
{
var pcode=$("#sheng").val();
$.ajax({
async:false, //关闭异步执行，开启同步执行
url:"cxchuli.php", //引用处理页面
data:{pcode:pcode}, //传递值
type:"POST", //传值方式
dataType:"TEXT", //返回数据格式
success: function(data){
//对返回的字符串进行去空格拆分，得到一个行的数组
var hang=data.trim().split("|");
//初始化变量为空
var str="";
//对数组进行循环遍历
for(var i=0;i<hang.length;i++)
{
//对每行的数据进行去空格拆分，得到一个列的数组
var lie= hang[i].trim().split("^");
//将数据进行拼接存入变量中
str=str+"<option value='"+lie[0]+"'>"+lie[1]+"</option>";
}
//将得到的数据，放入市级下拉菜单中显示
$("#shi").html(str);
}
})
}
//填充区（县）的方法
function FillQu()
{
//需要用到区（县）的父级代号
var pcode=$("#shi").val();
//调用AJAX方法
$.ajax({
async:false, //关闭异步执行，开启同步执行
url:"cxchuli.php", //引用处理页面
data:{pcode:pcode}, //传递值
type:"POST", //传值方式
dataType:"TEXT", //返回数据格式
success: function(data){
//对返回的字符串进行去空格拆分，得到一个行的数组
var hang=data.trim().split("|");
//初始化变量为空
var str="";
//对数组进行循环遍历
for(var i=0;i<hang.length;i++)
{
//对每行的数据进行去空格拆分，得到一个列的数组
var lie= hang[i].trim().split("^");
//将数据进行拼接存入变量中
str=str+"<option value='"+lie[0]+"'>"+lie[1]+"</option>";
}
//将得到的数据放到区（县）级下拉菜单中显示
$("#qu").html(str);
}
})
}
</script>