//sanji.php
<?php
//连接数据库
$conn = new mysqli('127.0.0.1','root','root','jingqu');
$sql = "select * from tplay_province";
$res = $conn->query($sql);
$list = $res->fetch_all(MYSQLI_ASSOC);
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<select name="" id="sheng">
<option value="">请选择省</option>
<?php
foreach($list as $val){
?>
<option value="<?php echo $val['provinceid']?>"><?php echo $val['province']?></option>
<?php
}
?>
</select>
<select name="" id="shi">
<option value="">请选择市</option>
</select>
<select name="" id="qu">
<option value="">请选择区</option>
</select>
</body>
<script src="js/jquery-3.5.1.js"></script>
<script>
$('#sheng').change(function(){
var id = $(this).val();
$.ajax({
url:'sjld.php',
data:{ids:id,type:1},
type:'post',
dataType:'json',
success: function(res){
// alert(res);
// console.log(res.data);
// alert(1);
var htm = '<option value="">请选择市</option>';
// console.log()
for(var i=0;i<res.data.length;i++){
// console.log(res.data[i].city);
htm += '<option value="'+res.data[i].cityid+'">'+res.data[i].city+'</option>';
}
$('#shi').html(htm);
$('#qu').html('<option value="">请选择区</option>');
},
error: function(xhr, status, error) {
console.log(xhr);
console.log(status);
console.log(error);
}
})
});
$('#shi').change(function(){
var id = $(this).val();
$.ajax({
url:'sjld.php',
data:{ids:id,type:2},
type:'post',
dataType:'json',
success:function(res){
console.log(res);
var htm = '<option value="">请选择区</option>';
for(var i=0;i<res.data.length;i++){
htm += '<option value="'+res.data[i].areaid+'">'+res.data[i].area+'</option>';
}
$('#qu').html(htm);
}
})
})
</script>
</html>
//sjld.php
<?php
header("Content-Type: text/html; charset=utf-8");
//连接数据库
$conn = new mysqli('127.0.0.1','root','root','jingqu');
$type = $_POST['type'];
$id = $_POST['ids'];
if($type == 1){
$sql = "select * from tplay_city where fatherid = $id";
}else{
$sql = "select * from tplay_area where fatherID = $id";
}
$res = $conn->query($sql);
$info = $res->fetch_all(MYSQLI_ASSOC);
$arr = [];
$arr['id'] = 1;
$arr['data'] = $info;
// var_dump($arr);
echo json_encode($arr);
?>