PHP页面：
//二级联动
public function diqu_show()
{
$data=Db::table("area")->where("parent_id=0")->select();
//var_dump($data);die;
$aa=$data[0]['id']+100;
$shi_data=Db::table("area")->where("parent_id='$aa'")->select();
// var_dump($shi_data);die;
$arr=['data'=>$data,'shi_data'=>$shi_data];
return view("diqu_show",['arr'=>$arr]);
}
//市级
public function shi_show()
{
$parent_id=Request::instance()->param("parent_id");
$shi_data=Db::table("area")->where("parent_id='$parent_id'")->select();
return view("diqu_show2",['shi_data'=>$shi_data]);
}
//省级
public function shiji_show()
{
$shi=Request::instance()->param("shi");
$shi=Db::table("area")->where("parent_id='$shi'")->select();
return view("diqu_show3",['shi'=>$shi]);
}
HTML页面：
diqu_show.html页面：
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<center>
<table>
<tr>
<td>
省区：
<select name="" id="" class="sheng">
<option value="">请选择</option>
{volist name="arr.data" id="v"}
<option value="{$v.id}">{$v.name}</option>
{/volist}
</select>
</td>
<td>
市级：
<select name="" id="" class="shi">
<option value="">请选择</option>
</select>
</td>
<td>
县/区：
<select name="" id="" class="xian">
<option value="">请选择</option>
</select>
</td>
</tr>
</table>
</center>
<script src="__STATIC__/js/jquery.min.js"></script>
<script>
$(function () {
$(document).on("change",".sheng",function () {
// var sheng=$("select option:selected").val();
var sheng=$(this).val();
//请求
$.get(
"{:url('index/shi_show')}?parent_id="+sheng,
function (data) {
$(".shi").html(data)
}
)
})
$(document).on("change",".shi",function () {
// var sheng=$("select option:selected").val();
var shi=$(this).val();
//请求
$.get(
"{:url('index/shiji_show')}?shi="+shi,
function (data) {
$(".xian").html(data)
}
)
})
})
</script>
</body>
</html>
diqu_show2.html页面
<option value="">请选择</option>
{volist name="shi_data" id="v"}
<option value="{$v.id}">{$v.name}</option>
{/volist}
diqu_show3.html页面
<option value="">请选择</option>
{volist name="shi" id="v"}
<option value="{$v.id}">{$v.name}</option>
{/volist}