ajax实现三级联动的基本方法
本文实例为大家分享了ajax实现三级联动的具体代码，供大家参考，具体内容如下
1.首先在一个页面上布置一个div方便日后引用方法
<body> <divid="sanji">//div的id为“sanji” </div>
2.sanjijs处理页面
$(document).ready(function(){
//向div里面放三个下拉菜单
varstr="<selectid='sheng'></select>
<selectid='shi'></select>
<selectid='qu'></select>";
//给三个下拉列表定义str变量
$("#sanji").html(str);
FillSheng();
FillShi();
FillQu();//ShengShiQu的逻辑顺序
$("#sheng").change(function(){
FillShi();
FillQu();
})//给sheng菜单添加点击事件
$("#shi").change(function(){
FillQu();
})//给shi菜单添加点击事件
});//页面加载完成之后过来执行某些代码
3.填充sheng方法
functionFillSheng()
{
varpcode="";//定义一个变量
$.ajax({
url:"chuli.php",
data:{pcode:pcode},
type:"POST",
dataType:"TEXT",
success:function(data){
varhang=data.split("^");
str+="<optionvalue='"+lie[0]+"'>"+lie[1]+"</option>";
}
$("#sheng").html(str);
});
}
2.填充shi方法
functionFillShi()
{
varpcode=$("#sheng").val();
$.ajax({
async:false,
url:"chuli.php",
data:{pcode:pcode},
type:"POST",
dataType:"TEXT",
success:function(data){
varhang=data.split("|");
varstr="";
for(vari=0;i<hang.length;i++)
{
varlie=hang[i].split("^");
str+="<optionvalue='"+lie[0]+"'>"+lie[1]+"</option>";
}
$("#shi").html(str);
}
});
}
3.填充qu方法
functionFillQu()
{
varpcode=$("#shi").val();
$.ajax({
url:"chuli.php",
data:{pcode:pcode},
type:"POST",
dataType:"TEXT",
success:function(data){
varhang=data.split("|");
varstr="";
for(vari=0;i<hang.length;i++)
{
varlie=hang[i].split("^");
str+="<optionvalue='"+lie[0]+"'>"+lie[1]+"</option>";
}
$("#qu").html(str);
}
});
}
4.chuli页面
<?php
include("DBDA.class.php");
$db=newDBDA();
$pcode=$_POST["pcode"];
$sql="select*fromchinastateswhereparentareacode='{$pcode}'";
echo$db->StrQuery($sql);
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持毛票票。