1200字范文,内容丰富有趣,写作的好帮手!
1200字范文 > PHP+MySql+Ajax+jQuery结合实现省市区三级联动功能

PHP+MySql+Ajax+jQuery结合实现省市区三级联动功能

时间:2021-06-14 07:59:47

相关推荐

PHP+MySql+Ajax+jQuery结合实现省市区三级联动功能

后端开发|php教程

PHP+MySql+Ajax+jQuery,省市区,php

后端开发-php教程

下面小编就为大家带来一篇使用PHP+MySql+Ajax+jQuery实现省市区三级联动功能示例。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧

rsa数字签名系统源码包,ubuntu双屏显示设置,tomcat9.0稳定吗,爬虫就业技能,如何下载php5.6.9,seo节点lzw

使用PHP+MySql+Ajax+jQuery实现省市区三级联动功能

易语言ge源码,vscode 当前文件编码,ubuntu和fr,tomcat 覆盖根目录,js误导爬虫,php 上传文件编码,四会seo推广公司,互联网在线教育网站系统,自适应企业站模板html5lzw

要求:写一个省市区(或者年月日)的三级联动,实现地区或时间的下拉选择。

.net多用户商城源码,乌班图怎么打开VScode,ubuntu网络架设,配置tomcat外网地址,论坛爬虫下载,php 生成随机颜色代码,连江网页seo费用是多少,多网站授权源码,dedecms企业站模板lzw

实现技术:php ajax

实现:省级下拉变化时市下拉区下拉跟着变化,市级下拉变化时区下拉跟着变化。

使用chinastates表查询

Ajax加载数据

1.这是chinastates表

2.做一个简单php:Ajax_eg.php

.sanji{ margin-left: 550px; margin-top: 150px; }

3.根据前一个页面做jquery:Ajax_ssq.js

// JavaScript Document//当页面内容都加载完才执行$(document).ready(function(e) { //加载三个下拉列表 $("#sanji").html(""); //加载显示数据 //1.加载省份 LoadSheng(); //2.加载市 LoadShi(); //3.加载区 LoadQu(); //当省份选中变化,重新加载市和区 $("#sheng").change(function(){ //当元素的值发生改变时,会发生 change 事件,该事件仅适用于文本域(text field),以及 textarea 和 select 元素。 //加载市 LoadShi(); //加载区 LoadQu(); }) //当市选中变化,重新加载区 $("#shi").change(function(){ //加载区 LoadQu(); }) });//加载省份信息function LoadSheng(){ //取父级代号 var pcode ="0001"; //根据父级代号查数据 $.ajax({ //取消异步,也就是必须完成上面才能走下面 async:false, url:"load.php", data:{pcode:pcode}, type:"POST", dataType:"JSON", success: function(data){var str="";//遍历数组,把它放入sjfor(var k in data){ str=str+""+data[k].[1]+"";}$("#sheng").html(str);} }); }//加载市信息function LoadShi(){ //取父级代号 var pcode =$("#sheng").val(); //根据父级代号查数据 $.ajax({ //取消异步,也就是必须完成上面才能走下面 async:false, url:"load.php", data:{pcode:pcode}, type:"POST", dataType:"JSON", success: function(data){var str="";//遍历数组,把它放入sjfor(var k in data){ str=str+""+data[k].[0]+"";}$("#shi").html(str);} }); }//加载区信息function LoadQu(){ //取父级代号 var pcode =$("#shi").val(); //根据父级代号查数据 $.ajax({ //不需要取消异步 url:"load.php", data:{pcode:pcode}, type:"POST", dataType:"JSON", success: function(data){var str="";//遍历数组,把它放入sjfor(var k in data){ str=str+""+data[k].[1]+""; }$("#qu").html(str);} }); }

4.再把数据库连接起来 :load.php,把DBDA重新加载一个方法:JsonQuery

JsonQuery($sql,0);

封装类

host,$this->uid,$this->pwd,$this->dbname); if(mysqli_connect_error()){ return "连接失败!"; } $result = $db->query($sql); if($type==1){ return $result;//增删改语句返回true或false }else{ return $result->fetch_all();//查询语句返回二维数组 } } //此方法用于ajax中用于对取出的数据(二维数组)进行拼接字符串处理 public function StrQuery($sql,$type=1){ $db = new MySQLi($this->host,$this->uid,$this->pwd,$this->dbname); if(mysqli_connect_error()){ return "连接失败!"; } $result = $db->query($sql); if($type==1){ return $result;//增删改语句返回true或false }else{ $arr = $result->fetch_all();//查询语句返回二维数组 $str = ""; foreach($arr as $v){ $str = $str.implode("^", $v)."|"; } $str = substr($str, 0,strlen($str)-1); return $str; } } //此方法用于ajax中用于返回为json数据类型时使用 public function JsonQuery($sql,$type=1){ $db = new MySQLi($this->host,$this->uid,$this->pwd,$this->dbname); if(mysqli_connect_error()){ return "连接失败!"; } $result = $db->query($sql); if($type==1){ return $result;//增删改语句返回true或false }else{ $arr = $result->fetch_all();//查询语句返回二维(关联)数组 return json_encode($arr);//将数组转换成json } }}

实现效果:

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。