封装的三级联动及应用
封装好的JS方法
sanjiliandong.js
$(document).ready(function(e) {$("#sanji").html("<select id='sheng'></select><select id='shi'></select><select id='qu'></select>");FillSheng();FillShi();FillQu();$("#sheng").change(function(){FillShi();FillQu();})$("#shi").change(function(){FillQu();})function FillSheng(){var code = "0001";$.ajax({async:false, //异步url:"chuli.php",data:{code:code},type:"POST",datatype:"TEXT",success: function(data){var hang = data.split('|');var s = "";for(var i=0;i<hang.length;i++){var lie = hang[i].split('^');s = s+"<option value='"+lie[0]+"'>"+lie[1]+"</option>";}$("#sheng").html(s);}});}function FillShi(){var code = $("#sheng").val();$.ajax({async:false, //异步url:"chuli.php",data:{code:code},type:"POST",datatype:"TEXT",success: function(data){var hang = data.split('|');var s = "";for(var i=0;i<hang.length;i++){var lie = hang[i].split('^');s = s+"<option value='"+lie[0]+"'>"+lie[1]+"</option>";}$("#shi").html(s);}});}function FillQu(){var code = $("#shi").val();$.ajax({async:false,url:"chuli.php",data:{code:code},type:"POST",datatype:"TEXT",success: function(data){var hang = data.split('|');var s = "";for(var i=0;i<hang.length;i++){var lie = hang[i].split('^');s = s+"<option value='"+lie[0]+"'>"+lie[1]+"</option>";}$("#qu").html(s);}});}});
负责处理及连接数据库的页面代码:
1.处理界面源代码
chuli.php
<?php include("mydbda.php");$code = $_POST["code"];$sql = "select * from ChinaStates where ParentAreaCode = '".$code."'";$db = new mydbda(); $str = $db->Select($sql,"CX","企业黄页"); echo $str; ?>
2.连接数据库代码
mydbda.php
<?phpclass mydbda{var $host = "localhost";var $username = "root";var $password = "123";var $database = "企业黄页";/**功能:执行SQL语句,返回结果参数:$sql:要执行的SQL语句$type:SQL语句的类型,CX代表查询,QT代表其他$data:要操作的数据库返回值:如果是查询,返回结果集如果是其他语句,执行成功返回OK,失败返回NO*/function Select($sql,$type,$data){//1.造连接对象$db = new mysqli($this->host,$this->username,$this->password,$data);//2.判断是否连接成功if(mysqli_connect_error()){ echo "连接失败";//退出整个程序exit;}else{//4.执行SQL语句$result = $db->query($sql);if($type == "CX"){$str = "";while($row = $result->fetch_row()){for($i=0;$i<count($row);$i++){$str=$str.$row[$i]."^";}$str = substr($str,0,strlen($str)-1);$str = $str."|";}$str = substr($str,0,strlen($str)-1);return $str;}else{if($result){return "OK";}else{return "NO";}}}}} ?>
主页面源代码
sanji.php
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script src="jquery-1.11.2.min.js"></script> <script src="sanjiliandong.js"></script> <title>无标题文档</title> </head><body><div><div id="sanji"></div></div></body></html>
转载于:https://www.cnblogs.com/fangchongyan/p/5207318.html
封装的三级联动及应用相关推荐
- java封装省市区三级json格式,微信开发 使用picker封装省市区三级联动模板
目前学习小程序更多的是看看能否二次封装其它组件,利于以后能快速开发各种小程序应用.目前发现picker的selector模式只有一级下拉,那么我们是否可以通过3个picker来实现三级联动模板的形式来 ...
- 微信小程序学习:使用picker封装省市区三级联动模板
目前学习小程序更多的是看看能否二次封装其它组件,利于以后能快速开发各种小程序应用.目前发现picker的selector模式只有一级下拉,那么我们是否可以通过3个picker来实现三级联动模板的形式来 ...
- python三级联动_ajax 实现三级联动
ajax 实现三级联动,相当于写了一个小插件,用的时候直接拿过来用就可以了,这里我用了数据库中的chinastates表, 数据库内容很多,三级联动里的地区名称都在里面,采用的是代号副代号的方式 比如 ...
- 非常不错的地区三级联动,js简单易懂。封装起来了(转)
非常不错的地区三级联动,js简单易懂.封装起来了 首先需要引入area.js,然后配置并初始化插件: 例: <!-- 绑定银行卡开始 --><script src="js/ ...
- java封装省市区三级json格式,2016中国省市区三级联动json格式.pdf
2016中国省市区三级联动json格式 2016 年中国省市区三级联的JSON 格式 {"北京市":{"name":"北京市"," ...
- 微信小程序的省市区三级地址mysql_微信小程序picker实现的省市区三级联动
微信小程序的省市区三级联动需要使用到的是Picker多列选择器,参考文档:https://www.w3cschool.cn/weix..., 案例中用到的省市区的json文件在文后发出出来. 废话不多 ...
- JAVA EE 中之AJAX 无刷新地区下拉列表三级联动
JSP页面 <html> <head> <meta http-equiv="Content-Type" content="text/html ...
- 微信小程序的省市区三级地址mysql_微信小程序 实现三级联动-省市区
序:项目中需要用到三级联动,自己试着写了下,也查了一些资料,现在把这个记录一下,里面地区数据,可根据个人需要做一些更改,我比较懒就不改了. wxml {{province}} {{city}} {{c ...
- android仿ios城市选择,Android 省市区三级联动选择器(仿iOS滚轮实现)
前言 在实际的项目中需要使用到省市区三级联动的功能,在网上找来找去,都没有找到一个合适的库, 所以自己就封装了一个,不需要自己添加数据源,直接引用即可,一行代码搞定城市选择.怎么简单,怎么方便,怎么来 ...
最新文章
- linux安装apache的纠结过程
- Raspberry Pi 4B 开机自动运行Python文件
- 【笔记】大数定理证明
- 算法提高课-图论-单源最短路的综合应用-AcWing 1135. 新年好:dijkstra和dfs暴搜结合
- 《1万小时成功定律——解构成功》
- 进程与线程的超级简单形象解释
- [笔记]Linux NTP命令 (ESX适用)
- 萝卜源码前后端源码+打包APP的教程
- 基于android预约功能,基于Android的银行业务预约系统的设计与实现
- mysql 复制_MySQL的复制功能
- 油田生产中的几个“三”
- 重新认识下科技核心目录吧!附容易发的期刊名单
- [AI] 如何制作一个低配山寨版贾维斯?-口语人机交互 Spoken Human Robot Interaction
- java中 是什么意思_java中?:是什么意思
- 如果以后找不到工作了,应该干点啥?
- visio2019和Mathtype7.0版本冲突,出现VBE6EXT.OLB不能被加载
- Partial Multi-Label Learning with Label Distribution-(PML-LD)-文献翻译
- jQuery css和显示隐藏及siblings使用
- 德威控股在港交所招股书失效:2021年度利润大增,由杨时家族控股
- .net平台SqlSuger学习之旅——1、安装SqlSugar
热门文章
- 在MySQL中当有多个索引时 你知道MySQL是如何选择索引的吗 ???
- vue中v-model指令的使用之Vue知识点归纳(九)
- 【zipkin】链路追踪
- Python functool module
- 特殊权限:SUID,SGID,Sticky
- 51单片机中断interrupt……using……
- windows安装dcm4chee 出错 check file system group LOSSY_STORAGE for deletion
- eclipce 快捷键
- [唐诗]正月十五日夜-苏味道
- BZOJ3833 : [Poi2014]Solar lamps