<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>無標題文檔</title>
<script src="../jquery-3.2.1.min.js"></script>
</head>
<body>
省: <select name="" id="sheng">
<option value="">請選擇</option>
</select>
市: <select name="" id="shi">
<option value="">請選擇</option>
</select>
區: <select name="" id="qu">
<option value="">請選擇</option>
</select>
</body>
</html>
<script>
$(function(){
//獲取省的信息
ajaxFun(0,"sheng");
})
function ajaxFun(id,type){
$.ajax({
url:"sjld.php",//服務器的地址
data:{id:id},//發送的數據
success:function(data){//執行成功的回調
strToArr(data,type);//調用函數
}
});
}
function strToArr(str,type){//字符串轉數組
var arr = str.split('^'),//第一維
brr = [];//定義第二維數組
for(var i=0;i<arr.length;i++){//循環遍歷第一維的數組
var temp =arr[i].split(',');//第二維
brr.push(temp);//將第一維的數組放入第二維
}
addHTML(brr,type);//網頁追加
}
function addHTML(brr,type){//網頁追加
var str ='<option value="">請選擇<?option>';
for(var i in brr){
str+='<option value="'+brr[i][0]+'">'+brr[i][1]+'</option>';
}
$('#'+type).html(str);
}
$('#sheng').change(function(){//省的下拉 值改變的時候添加事件
var id=$(this).val();//獲取選擇的省的id
ajaxFun(id,"shi");//ajax再獲取市
})
$('#shi').change(function(){//市的下拉 值改變的時候添加事件
var id=$(this).val();//獲取選擇的市的id
ajaxFun(id,"qu");//ajax再獲取區
})
</script>
<?php
//連接數據庫
$db =new MySQLi('localhost','root','','z_0705');//登錄的數據庫
!mysqli_connect_error()or die("連接失敗");//如果連接錯誤
$db->query("set names utf8");//字符集是utf8
//接受數據
$id=0;
if(!empty($_GET)){//如果得到的數不是空
$id = $_GET['id'];//獲取省的id
}
//查表父id=0
$sql = "select id,area_name from dt_area where area_parent_id=$id";
$res=$db->query($sql);//執行sql語句，返回結果集
$arr=$res->fetch_all();//把結果集轉成數組
//返回數據 字符串
arrTostr($arr);
function arrTostr($a){//$a是結果集返回的是二維數組
$brr = array();//定義一個數組用來存數組轉字符串
foreach($a as $v){//遍歷數組里面的數
$temp = implode(",",$v);//遍歷數組里面的數
$brr[] = $temp;//轉成一維數組
}
echo implode("^",$brr);//轉成字符串
}