分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置：首页 > 教程案例

ajax三级联动

发布时间：2023-09-06 01:43责任编辑：熊小新关键词：暂无标签

Ajax三级联动

全国省市县查询

html代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<!doctypehtml>
<html>
<head>
<metacharset="utf-8">
<title>无标题文档</title>
<scriptsrc="../jquery-1.11.2.min.js"></script>
<scriptsrc="sanji.js"></script>
</head>
<body>
<h1>区域查询</h1>
<div></div>
</body>
</html>

js代码实现各区市随省的变化而变化

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
$(document).ready(function(e) {
$("#sanji").html("<select id=‘sheng‘></select><select id=‘shi‘></select><select id=‘qu‘></select>");//将三个下拉的字符串交给前边的div
tiansheng();//加载省的数据
tianshi();//加载市的数据
tianqu();//加载区 的数据
$("#sheng").change(function(){//变化后执行
tianshi();//重新加载市
tianqu();//重新加载区
})
$("#shi").change(function(){//变化后执行
tianqu();//加载区的数据
})
});
functiontiansheng(){
varpcode ="0001";//找出省的父级代号
$.ajax({
async:false,//同步加载
url:"states.php",
data:{pcode:pcode},
type:"POST",
dataType:"TEXT",
success:function(data){
varhang = data.split("|");//拆分行
varstr ="";
for(vari=0;i<hang.length;i++){
varlie = hang[i].split("^");//拆分列
str +="<option value=‘"+lie[0]+"‘>"+lie[1]+"</option>";
}
$("#sheng").html(str);
}
});
}
functiontianshi(){
varpcode = $("#sheng").val();//找市的父级代号，省选中项的值
$.ajax({
async:false,//同步加载
url:"states.php",
data:{pcode:pcode},
type:"POST",
dataType:"TEXT",
success:function(data){
varhang = data.split("|");
varstr ="";
for(vari=0;i<hang.length;i++){
varlie = hang[i].split("^");
str +="<option value=‘"+lie[0]+"‘>"+lie[1]+"</option>";
}
$("#shi").html(str);
}
});
}
functiontianqu(){
varpcode = $("#shi").val();//找区的父级代号，市选中项的值
$.ajax({
url:"states.php",
data:{pcode:pcode},
type:"POST",
dataType:"TEXT",
success:function(data){
varhang = data.split("|");
varstr ="";
for(vari=0;i<hang.length;i++){
varlie = hang[i].split("^");
str +="<option value=‘"+lie[0]+"‘>"+lie[1]+"</option>";
}
$("#qu").html(str);
}
});
}

处理页面

1
2
3
4
5
6
<?php
$pcode=$_POST["pcode"];
require"DBDA.class.php";
$db=newDBDA();
$sql="select * from chinastates where parentareacode=‘{$pcode}‘";
echo$db->strquery($sql);

DBDA封装功能

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
<?php
classDBDA{
public$host="localhost";//服务器地址
public$uid="root";//用户名
public$pwd="123";//密码
public$dbname="crud";//数据库名称
publicfunctionquery($sql,$type=0){
$db=newMySQLi($this->host,$this->uid,$this->pwd,$this->dbname);
$result=$db->query($sql);
我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved