PHP+AJAX 地区三级联动代码
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!--------------------------------------------------------------
--省的字段是：province
--市的字段是：city
--县的字段是：area
--------------------------------------------------------------------------->
<script type="text/javascript">
var xmlHttp;//声明变量
var requestType="";//声明初始类型为空
function createXMLHttpRequest()//定义创建一个跨浏览器函数的开头
{
if(window.ActiveXObject)//ActiveXObject对象到找到的时候返回的是真，否则是假
{
xmlHttp=new
ActiveXObject("Microsoft.XMLHTTP");//这个是使用IE的方法创建XmlHttp
}
else
if(window.XMLHttpRequest)
{
xmlHttp=new
XMLHttpRequest();//这个是使用非IE的方法创建XmlHttp
}
}
function handleStateChange(){//判断返回的一个函数，来确定执行那个的函数
if(xmlHttp.readyState==4)
{//4说明是执行交互完毕0 (未初始化)1 (正在装载)2
(装载完毕) 3 (交互中)4 (完成)
if(xmlHttp.status==200)
{//http的一个报头说明成功找到
if(requestType=="city"){//判断查询的类型
showcity();//返回响应的显示
}
else if(requestType="area"){//判断响应的查询的类型
showarea();//返回响应的显示
}
}
}
}
function queryCity(citycode){//执行程序查询，查询城市的
createXMLHttpRequest();//调用创建XmlHttp的函数
requestType="city";//表示类型，查询城市处理显示的时候需要用到
var
url='data.php?provincecode='+citycode+'&n='+Math.random();//设定URL传值方法同时防止缓存
xmlHttp.open("GET",url,true);//建立服务器连接，异步传输tree
xmlHttp.onreadystatechange=handleStateChange;//处理这个响应所需要的函数
xmlHttp.send(null);//执行程序函数这里的中间的参数是因为GET原因
}
function queryArea(citycode){//查询程序
createXMLHttpRequest();//调用创建XmlHttp的函数
requestType="area";//查询县的
var
url="data.php?citycode="+citycode+'&n='+Math.random();//设定URL传值方法同时防止缓存
xmlHttp.open("GET",url,true);
xmlHttp.onreadystatechange=handleStateChange;//处理响应的函数名
xmlHttp.send(null);//执行程序函数这里的中间的参数是因为GET原因
}
function showcity(){//显示函数
document.getElementByIdx_x("city").innerHTML=xmlHttp.responseText;//捕获ID显示返回的数据
}
function showarea(){
document.getElementByIdx_x("area").innerHTML=xmlHttp.responseText;//捕获ID显示返回的数据
}
</script>
</head>
<body>
<?php
$conn=mysql_connect("localhost","root","root");//链接数据库
mysql_select_db("novel");//选择数据库
mysql_query("set
names 'utf8'");//设定字符集
$sql="select *
from province";//查询数据库province表也就是省
$result=mysql_query($sql);//执行语句赋值给变量
?>
<form id='form1'><!--输出表单头-->
<!--输出下拉列表框，并设定onchange响应事件，把省值传递过去-->
<select id='province'onchange='queryCity(this.options[this.selectedIndex].value)'>
<!--输出下拉列表项值-->
<option value='-1' selected>请选择省份</option>
<?php
while($row=mysql_fetch_row($result)){
//循环循环查询显示省输出数据显示
echo "<option
value='$row[1]'>$row[2]</option>\n";
}
?>
</select><!--下拉列表项尾数-->
<span id='city'></span><!--显示数据的城市的位置-->
<span id='area'></span><!--显示数据的城市的位置-->
</form><!--表单项结尾-->
</body>
</html>
data.php 代码
$provincecode=$_GET['provincecode'];//接收省键值
$citycode=$_GET['citycode'];//接收城市键值
$conn=mysql_connect("localhost","root","root");//连接主机
mysql_select_db("novel");//选择数据库
mysql_query("set
names 'utf8'");
if($provincecode!=""){//如果传递过来的不为空则执行
$sql="select *
from city where provincecode=$provincecode";//查询城市符合属于上边传递过来的省的字段
$result=mysql_query($sql);//执行SQL查询语句
print_r($row);
?>
<select
onchange='queryArea(this.options[this.selectedIndex].value)'><!--下拉列表框开头-->
<option value='-1'
selected>请选择城市</option><!--下拉列表框值开头-->
<?php while($row=mysql_fetch_row($result)){//循环记录集?>
<option
value="]?></option>
<?php }?>
</select>
<?php }?>
<?php
if($citycode!=""){
$sql="select *
from area where citycode=$citycode";
$result=mysql_query($sql);
echo "<select>\n";
echo "<option value='-1'
selected>请选择县</option>\n";
while($row=mysql_fetch_row($result)){
echo "<option value='$row[1]'>$row[2]</option>\n";
}
echo "</select>\n";
}
?>
PHP+AJAX 地区三级联动代码的更多相关文章
- 省市区(县)三级联动代码（js 数据源）
ylbtech-JavaScript-Utility:省市区(县)三级联动代码(js 数据源) 省市区(县)三级联动代码(js 数据源) 1.A,源代码(Source Code)返回顶部 1.A.1, ...
- ajax 实现三级联动
ajax 实现三级联动,相当于写了一个小插件,用的时候直接拿过来用就可以了,这里我用了数据库中的chinastates表, 数据库内容很多,三级联动里的地区名称都在里面,采用的是代号副代号的方式 比如 ...
- ajax 实现三级联动下拉菜单
ajax 实现三级联动,相当于写了一个小插件,用的时候直接拿过来用就可以了,这里我用了数据库中的chinastates表, 数据库内容很多,三级联动里的地区名称都在里面,采用的是代号副代号的方式 比如 ...
- PHP ajax 实现三级联动
在一个单独JS页面中,利用ajax实现三级联动,做成一个三级联动形式,以便于以后随时调用 JS代码: $(document).ready(function(e) { $("#sanji&qu ...
- AJAX部分---对比js做日期的下拉选择 和 ajax做三级联动；
js做日期选择: 实现当前年份的前5后5年的日期选择 实现功能:年份和月份页面加载完成使用JS循环添加,天数根据月份的变化动态添加改变 扩展功能:天数可以根据闰年平年变化 <body> & ...
- 在使用ajax实现三级联动调用数据库数据并通过调出的数据进行二级表单查询
在使用ajax实现三级联动查询数据库数据后再使用ajax无刷新方式使用三级联动调出的数据进行二级查询 但是现在遇到问题,在二级查询的时候期望是将数据以表格的形式展示在三级联动的下方,但是现在在查询后会 ...
- 非常不错的地区三级联动，js简单易懂。封装起来了
首先需要引入area.js,然后配置并初始化插件: 例: <!-- 绑定银行卡开始 --> <script src="js/area.js"></sc ...
- php+ajax的三级联动下拉菜单
封装一个三级联动,就可以在任何页面进行引用了 先写个页面引用一下这个js <head> <meta http-equiv="Content-Type" conte ...
- ajax省市区三级联动
jdbc+servlet+ajax开发省市区三级联动 技术点:jdbc操作数据库,ajax提交,字符拦截器,三级联动 特点:局部刷新达到省市区三级联动,举一反三可以做商品分类等 宗旨:从实战中学习 博 ...
随机推荐
- ecshop后台增加模块菜单项详细教程(图文)
有的时候我们会在后台增加新的功能,菜单项是一个程序的入口,是必不可少的,如何在后台增加菜单项呢,大家可以参考下面的教程: 例如:想在后台左侧的菜单栏的"促销管理"下添加一个&q ...
- 块和内嵌总结，以及各个标签的应用。其中的ul ol dl特殊定义为auto，使得里面的内容展开
<!doctype html> <html> <head> <meta charset="UTF-8"/> <title> ...
- Python3基础 list(zip()) 将两个列表打包起来
镇场诗: 诚听如来语,顿舍世间名与利.愿做地藏徒,广演是经阎浮提. 愿尽吾所学,成就一良心博客.愿诸后来人,重现智慧清净体.-------------------------------------- ...
- 基于js脚本的单机黄金点游戏
题目描述 N个同学(N通常大于10),每人写一个0-100之间的有理数 (不包括0或100),交给裁判,裁判算出所有数字的平均值,然后乘以0.618(所谓黄金分割常数),得到G值.提交的数字最靠近G( ...
- javascript 中的闭包
在 javascript 中,函数可以当做参数传递,也可以当做返回值返回. 当一个函数内部返回值为一个函数时, 就形成了闭包.(闭包里面的 this 问题) 如下面代码 Function.protot ...
- Sublime Text 3 搭建 Golang 开发环境
安装Golang go语言主页: https://golang.org/ go语言安装下载: https://golang.org/dl 环境变量设置: GOROOT: GOROOT变量设置go安装的 ...
- JQuery常用动画实现函数
1.上拉.下拉和切换 slideup().slidedown().slideToggle() JQuery里面的切换太吊了,它自带判断当前显示状态,如果为显示就执行隐藏,如果为隐藏就执行显示. 2.淡 ...
- Linux的iptables常用配置范例（2）
iptables -F #清除所有规则 iptables -X #清除所有自定义规则 iptables -Z #各项计数归零 iptables -P INPUT DROP #将input链 ...
- 多年心愿，终于完成，热泪盈眶啊。。。Adrew NG 的 机器学习
谢谢Andrew老师!谢谢Coursera!谢谢自己!希望这是一个好的开始!希望自己也能使用机器学习来make a better world...
- frame间跳转及相关问题
body{ font-family: "Microsoft YaHei UI","Microsoft YaHei",SimSun,"Segoe UI& ...