本文实例为大家分享了ajax三级联动展示的具体代码，供大家参考，具体内容如下
1. test.php
<script src="../jquery-1.11.2.min.js"></script><script src="sanji.js"></script><title>无标题文档</title></head><body><h1>三级联动</h1><div id="sanji"></div></body></html>
2. sanji.js
// JavaScript Document$(document).ready(function(e) {
//找到ID=SANJI的DIV，造三个下拉扔进去 $("#sanji").html("<select id='sheng'></select><select id='shi'></select><select id='qu'></select>");
//加载省的数据 LoadSheng();
//加载市的数据 LoadShi();
//加载区的数据 LoadQu();
//给省的下拉加点击事件 $("#sheng").click(function(){
//重新加载市 LoadShi();
//重新加载区 LoadQu();
}
) //给市的下拉加点击事件 $("#shi").click(function(){
//重新加载区 LoadQu();
}
) }
);
//加载省份的方法function LoadSheng(){
//省的父级代号 var pcode = "0001";
$.ajax({
async:false, url:"chuli.php", data:{
pcode:pcode}
, type:"POST", dataType:"TEXT", success: function(data){
var hang = data.trim().split("|");
var str = "";
for(var i=0;
i<hang.length;
i++) {
var lie = hang[i].split("^");
str = str+"<option value='"+lie[0]+"'>"+lie[1]+"</option>";
}
$("#sheng").html(str);
}
}
);
}
//加载市的方法function LoadShi(){
//找市的父级代号 var pcode = $("#sheng").val();
$.ajax({
async:false, url:"chuli.php", data:{
pcode:pcode}
, type:"POST", dataType:"TEXT", success: function(data){
var hang = data.trim().split("|");
var str = "";
for(var i=0;
i<hang.length;
i++) {
var lie = hang[i].split("^");
str = str+"<option value='"+lie[0]+"'>"+lie[1]+"</option>";
}
$("#shi").html(str);
}
}
);
}
//加载区的方法function LoadQu(){
//找区的父级代号 var pcode = $("#shi").val();
$.ajax({
url:"chuli.php", data:{
pcode:pcode}
, type:"POST", dataType:"TEXT", success: function(data){
var hang = data.trim().split("|");
var str = "";
for(var i=0;
i<hang.length;
i++) {
var lie = hang[i].split("^");
str = str+"<option value='"+lie[0]+"'>"+lie[1]+"</option>";
}
$("#qu").html(str);
}
}
);
}
3. chuli.php
<?php//给一个父级代号，返回该父级代号下所有的子地区require "DBDA.class.php";
$db=new DBDA();
$pcode=$_POST["pcode"];
$sql="select areacode,areaname from chinastates where parentareacode='{
$pcode}
'";
echo $db->StrQuery($sql);
引用的封装类里面返回字符串的方法
<?phpclass DBDA{
public $host = "localhost";
public $uid = "root";
public $pwd = "123";
public $dbname = "test_123";
//执行SQL语句返回相应的结果 //$sql 要执行的SQL语句 //$type 代表SQL语句的类型，0代表增删改，1代表查询 function query($sql,$type=0) {
$db = new MySQLi($this->host,$this->uid,$this->pwd,$this->dbname);
$result = $db->query($sql);
if($type) {
//如果是查询，显示数据 return $result->fetch_all();
}
else {
//如果是增删改，返回true或者false return $result;
}
}
//返回字符串的方法 public function strquery($sql,$type=1) {
$db = new MySQLi($this->host,$this->uid,$this->pwd,$this->dbname);
$result = $db->query($sql);
$arr = $result->fetch_all();
$str="";
foreach($arr as $v) {
$str = $str.implode("^",$v)."|";
}
$str = substr($str,0,strlen($str)-1);
return $str;
}
//返回JSON function JSONQuery($sql,$type=1) {
$db = new MySQLi($this->host,$this->uid,$this->pwd,$this->dbname);
$r = $db->query($sql);
if($type==1) {
return json_encode($r->fetch_all(MYSQLI_ASSOC));
}
else {
return $r;
}
}
}
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。
