最近研究了一下联动原理，大多数联动都是通过ajax实现的，其实就是通过ajax把页面数据传给后台，在不刷新页面的情况下，改变下拉框的值。话不多说上代码讲解：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>测试页面</title>
<script type="text/javascript" src="jquery-3.3.1.min.js">
</script>
<script type="text/javascript">
var sheng;
function fun(){
sheng=$("#sheng").val();
$.get("sheng.php",{sheng:sheng},
function (data){
$("#shi").html(data);
});
}
function fun2(){
var shi=$("#shi").val();
$.get("shi.php",{shi:shi,sheng:sheng},
function (data){
$("#qu").html(data);
});
}
</script>
</head>
<body>
<select id="sheng" onchange="fun()">
<option value="">请选择省份</option>
<option value="1">山东</option>
<option value="2">河北</option>
</select>
<select id="shi" onchange="fun2()">
<option>请选择市</option>
</select>
<select id="qu">
<option value="">请选择区</option>
</select>
</body>
</html>
这是HTML和jQuery的部分，为了让大家明白，我现在讲解一下jQuery的$.get()方法。
他有三个参数：
第一个参数是发送请求的URL地址，在这里也就是sheng.php和shi.php；
第二个参数是需要传的值，要用{}包裹起来，格式为{变量名：变量}，传多个值{变量名1：变量值1，变量名2：变量值2}；
第三个参数是需要调用的方法，其中括号里的 data 不是传参，而是返回值，是URL地址运行后返回来的值。（注：val()是jQuery中来获取value的函数，html()是jQuery中用来获取元素值的函数）
下面来看一下PHP代码
<?php
//这里是sheng.php
$sheng=$_GET['sheng'];
if($sheng=="1"){
echo "<option>请选择</option><option value='1'>淄博市</option><option value='2'>泰安市</option>";
}
if($sheng=="2"){
echo "<option>请选择</option><option value='1'>石家庄市</option><option value='2'>唐山市</option>";
}
<?php
//这里是shi.php
$sheng=$_GET['sheng'];
$shi=$_GET['shi'];
if($sheng=="1"){
if($shi=="1"){
echo "<option>请选择</option><option value='1'>张店区</option><option value='2'>桓台区</option>";
}
if($shi=="2"){
echo "<option>请选择</option><option value='1'>泰山区</option><option value='2'>岱岳区</option>";
}
}
if($sheng=="2"){
if($shi=="1"){
echo "<option>请选择</option><option value='1'>长安区</option><option value='2'>桥东区</option>";
}
if($shi=="2"){
echo "<option>请选择</option><option value='1'>丰南区</option><option value='2'>丰润区</option>";
}
}
因为用的是get（）方法，所以是get接收。因为只是讲解一下方法，所以在此我不在演示从数据库中调取数据。值得注意的是，在PHP中只有echo出的数据，才会被jQuery中的get方法中的data所接收。
想要用post方法，只要把所有get替换即可正常运行。