PHP+Ajax+JS省市区三级联动_PHP教程

index.html代码：

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

thumbnails.js代码： window.onload = getProvince; function createRequest() {//Ajax于PHP交互需要对象 try { request = new XMLHttpRequest();//创建一个新的请求对象; } catch (tryMS) { try { request = new ActiveXObject("Msxml2.XMLHTTP"); } catch (otherMS) { try { request = new ActiveXObject("Microsoft.XMLHTTP"); } catch (failed) { request = null; } } } return request; } function sech(id) {//省市改变时触发，select的onchange事件 var aa = document.getElementById(id); if(id=="sheng"){ getCity(aa.value);//这里aa.value为省的id } if(id=="shi") { getCounty(aa.value);//这里aa.value为市的id } } function getProvince() {//获取所有省 request = createRequest(); if (request == null) { alert("Unable to create request"); return; } var url= "getDetails.php?ID=0";//ID=0时传递至PHP时让其获取所有省 request.open("GET", url, true); request.onreadystatechange = displayProvince; //设置回调函数 request.send(null); //发送请求 } function getCity(id){//获取省对应的市 request = createRequest(); if (request == null) { alert("Unable to create request"); return; } var url= "getDetails.php?ID=" + escape(id); request.open("GET", url, true); request.onreadystatechange = displayCity; request.send(null); } function getCounty(id){//获取市对应的区 request = createRequest(); if (request == null) { alert("Unable to create request"); return; } var url= "getDetails.php?ID=" + escape(id); request.open("GET", url, true); request.onreadystatechange = displayCounty; request.send(null); } function displayProvince() {//将获取的数据动态增加至select if (request.readyState == 4) { if (request.status == 200) { var a=new Array; var b=request.responseText;//将PHP返回的数据赋值给b a=b.split(",");//通过","将这一数据保存在数组a中 document.getElementById("sheng").length=1; var obj=document.getElementById("sheng'); for(i=0;i obj.options.add(new Option(a[i],i+1)); //动态生成OPTION加到select中，第一个参数为Text,第二个参数为Value值. } } } function displayCity() {//将获取的数据动态增加至select if (request.readyState == 4) { if (request.status == 200) { var a=new Array; var b=request.responseText; a=b.split(","); document.getElementById("shi").length=1;//重新选择 document.getElementById("xian").length=1;//重新选择 if(document.getElementById("sheng").value!="province"){ var obj=document.getElementById('shi'); for(i=0;i obj.options.add(new Option(a[i], document.getElementById("sheng").value*100+i+1)); //ocument.getElementById("sheng").value*100+i+1对应的是市的ID。 } } } } function displayCounty() {//将获取的数据增加至select if (request.readyState == 4) { if (request.status == 200) { var a=new Array; var b=request.responseText; a=b.split(","); document.getElementById("xian").length=1; if(document.getElementById("sheng").value!="province"&&document.getElementById("shi").value!="city"){ var obj=document.getElementById('xian'); for(i=0;i obj.options.add(new Option(a[i],i+1001)); } } } } getDetails.php代码：

header("Content-Type: text/html; charset=gb2312");
$conn = new COM("ADODB.Connection") or die("Cannot start ADO");
$connstr = "Provider=SQLOLEDB;Persist Security Info=False;User ID=sa;Password=zzh;Initial Catalog=NoteBook;Data Source=localhost";

if($_REQUEST['ID']==0){//获得省列表
$conn->Open($connstr); //建立数据库连接
$sqlstr = "select name from Province"; //设置查询字符串
$rs = $conn->Execute($sqlstr); //执行查询获得结果
$num_cols = $rs->Fields->Count(); //得到数据集列数
$Province=array();
$i=0;
while (!$rs->EOF) {
$Province[$i]=$rs->Fields['name']->Value.",";
$rs->MoveNext();
$i++;
}
foreach($Province as $val)
echo $val;
$conn->Close();
$rs = null;
$conn = null;
}



if($_REQUEST['ID']>0&&$_REQUEST['ID']<35){//获得省对应的市列表
$conn->Open($connstr); //建立数据库连接
$sqlstr = "select name from City where cid=".$_REQUEST['ID']; //设置查询字符串
$rs = $conn->Execute($sqlstr); //执行查询获得结果
$num_cols = $rs->Fields->Count(); //得到数据集列数
$City=array();
$i=0;
while (!$rs->EOF) {
$City[$i]=$rs->Fields['name']->Value.",";
$rs->MoveNext();
$i++;
}
foreach($City as $val)
echo $val;
$conn->Close();
$rs = null;
$conn = null;
}



if($_REQUEST['ID']>100){//获得省市对应的县列表
$conn->Open($connstr); //建立数据库连接
$sqlstr = "select name from County where cid=".$_REQUEST['ID']; //设置查询字符串
$rs = $conn->Execute($sqlstr); //执行查询获得结果
$num_cols = $rs->Fields->Count(); //得到数据集列数
$County=array();
$i=0;
while (!$rs->EOF) {
$County[$i]=$rs->Fields['name']->Value.",";
$rs->MoveNext();
$i++;
}
foreach($County as $val)
echo $val;
$conn->Close();
$rs = null;
$conn = null;
}
?>

数据库设计，表格Province表，City表，County表。 要求：Province表需要id和name，id建议从1至34，例如北京id为1，广东id为2，以此类推； City表需要id,name和cid，id为cid*100+1，cid为该市的上级，例如深圳的上级为广东省,cid为2的话，深圳的id就是201，以此类推。 County表需要id,name和cid，因为是三级的关系，id可以随意，建议从10001开始自增。cid为所在上级，例如宝安区的cid为201，龙岗区的cid也为201； 截图： HTML效果： 完成后效果： 备注：PHP是服务器端的，建议发布网站后通过ip调试。

http://www.bkjia.com/PHPjc/775949.htmlwww.bkjia.comtruehttp://www.bkjia.com/PHPjc/775949.htmlTechArticle基本思想就是：在JS动态创建select控件的option,通过Ajax获取在PHP从SQL数据库获取的省市区信息，代码有点长，但很多都是类似的，例如JS中省...

• < 上一篇

  laravel学习笔记（1）-Composer概述及其自动加载探秘_PHP教程

• 下一篇 >

  浅析PHP微信支付通知的处理方式_PHP教程

人气教程排行

• 174次 1 php如何获取跳转前的url
• 174次 2 php格林威治时间转换成当前时间的方法
• 174次 3 为什么php不能做大型系统？
• 174次 4 range函数怎么用
• 174次 5 php中计算页面加载时间几种方法总结_PHP教程
• 174次 6 求帮助，关于paypal支付返回值修改订单状态
• 174次 7 typecho怎么配置文章内容页?
• 174次 8 PhpStorm左侧structure不显示文件的方法列表是这么回事？
• 174次 9 查看PHP的环境变量_PHP
• 174次 10 PHP Primary script unknown 解决方法总结
• 174次 11 php的命名空间与自动加载实现方法
• 174次 12 解决laravel 出现ajax请求419(unknown status)的问题
• 173次 13 php 如何删除mysql记录
• 173次 14 PHP如何替换数组中的指定元素
• 173次 15 怎么去除字符串中非汉字、非字母、非数字的字符
• 173次 16 mysql如何一次执行多条SQL语句
• 173次 17 修改header里面的Connection为close解决方法
• 173次 18 PHP基于session.upload_progress 实现文件上传进度显示功能详解
• 173次 19 php5.6.x到php7.0.x特性小结
• 172次 20 php为什么会出现504错误

本站所有资源全部来源于网络，若本站发布的内容侵害到您的隐私或者利益，请联系我们删除！

登录

  记住我的登录 忘记密码？

登录