三级联动下拉列表——php 、Ajax
主页面:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<select id="sheng">
<option>请选择</option>
</select>
<select id="shi">
<option>请选择</option>
</select>
<select id="xian">
<option>请选择</option>
</select>
<script src="../js/jquery-2.2.3.min.js"></script>
<script>
$.ajax({
data: {parent_id: 0}, //发送的数据
dataType: "json", //返回值的类型 text为string型
type: 'post', //发送请求的方法(get)
url: 'sheng.php',//发送请求的地址
success: function (data) {//发送成功时的回调函数
// console.log(data);
for (var i in data) {
$("#sheng").append("<option value='"+ data[i][2] +"'>" + data[i][1] +"</option>")
}
}
}) $("#sheng").change(function(){
$("#shi").get(0).options.length=1;
var data = $("#sheng").find("option:selected").val();
$.ajax({
data: {parent_id: data}, //发送的数据
dataType: "json", //返回值的类型 text为string型
type: 'post', //发送请求的方法(get)
url: 'sheng.php',//发送请求的地址
success: function (data) {//发送成功时的回调函数
for (var i in data) {
$("#shi").append("<option value='"+ data[i][2] +"'>" + data[i][1] +"</option>")
}
}
})
}) $("#shi").change(function(){
$("#xian").get(0).options.length= 1;
var data = $("#shi").find("option:selected").val();
$.ajax({
data: {parent_id: data}, //发送的数据
dataType: "json", //返回值的类型 text为string型
type: 'post', //发送请求的方法(get)
url: 'sheng.php',//发送请求的地址
success: function (data) {//发送成功时的回调函数
for (var i in data) {
$("#xian").append("<option value='"+ data[i][2] +"'>" + data[i][1] +"</option>")
}
}
})
})
</script>
</body>
</html> 处理页面sheng.php:
<?php
require_once "../db/DBDA.class.php";
$db = new DBDA();
$sql = "select * from region WHERE father_id = {$_POST['parent_id']}";
$result = $db->Query($sql);
echo json_encode($result);
?>
三级联动下拉列表——php 、Ajax的更多相关文章
- Java下使用Apache POI生成具有三级联动下拉列表的Excel文档
使用Apache POI生成具有三级联动下拉列表的Excel文档: 具体效果图与代码如下文. 先上效果图: 开始贴代码,代码中部分测试数据不影响功能. 第一部分(核心业务处理): 此部分包含几个方面: ...
- 省份-城市-区域三级联动【struts2 + ajax +非数据库版】
package loaderman; /** * 实体,封装省份和城市 */ public class Bean { private String province;//省份 private Stri ...
- ajax——实现三级联动下拉列表
数据库: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3 ...
- 省市区三级联动(jquery+ajax)(封装和不封装两种方式)-----2017-05-15
首先,要实现如下图效果, 1.要理清思路: 先做出三个下拉菜单----根据第一个下拉菜单的value值获取第二个下拉列表的内容,第三个同理. 2.用到的数据库表:Chinastates表 规律:根据国 ...
- 【转】纯JS省市区三级联动(行政区划代码更新至2015-9-30)
本文代码实现的功能是省市区三级联动下拉列表,纯Javascript,网上已有很多这方面的代码.但是作为一个新手,这是我的第一篇CSDN博客,发此文的目的主要是学习交流,希望看到的朋友发现有什么不对的地 ...
- JAVA EE 中之AJAX 无刷新地区下拉列表三级联动
JSP页面 <html> <head> <meta http-equiv="Content-Type" content="text/html ...
- AJAX部分---对比js做日期的下拉选择 和 ajax做三级联动;
js做日期选择: 实现当前年份的前5后5年的日期选择 实现功能:年份和月份页面加载完成使用JS循环添加,天数根据月份的变化动态添加改变 扩展功能:天数可以根据闰年平年变化 <body> & ...
- Ajax实现三级联动(0520)
查询数据库中的chinastates表,通过父级代号查询相应省市区. 实现界面: 在js页面实现三级联动 在JQuery中调用Ajax方法(引用JQuery文件一定放在最上面) 用插件的形式,创建三个 ...
- 使用php ajax写省、市、区、三级联动
题目要求: 要求:写一个省市区(或者年月日)的三级联动,实现地区或时间的下拉选择. 实现技术:php ajax 实现:省级下拉变化时市下拉区下拉跟着变化,市级下拉变化时区下拉跟着变化. 使用china ...
随机推荐
- 解决小程序报错 Page "pages/index/main" has not been registered yet.
在小程序开发中,会频繁遇到 Page "pages/index/main" has not been registered yet. 这种报错,意思就说指定的页面没有注册,找 ...
- 洛谷P1144最短路计数
题目描述 给出一个NNN个顶点MMM条边的无向无权图,顶点编号为1−N1-N1−N.问从顶点111开始,到其他每个点的最短路有几条. 输入格式 第一行包含222个正整数N,MN,MN,M,为图的顶点数 ...
- HDU1875 畅通工程再续
相信大家都听说一个“百岛湖”的地方吧,百岛湖的居民生活在不同的小岛中,当他们想去其他的小岛时都要通过划小船来实现.现在政府决定大力发展百岛湖,发展首先要解决的问题当然是交通问题,政府决定实现百岛湖的全 ...
- 基于Modelsim的视频捕获模拟仿真
一.前言 针对牟新刚编著的<基于FPGA的数字图像处理原理及应用>中第五章系统仿真中关于视频捕获模拟的例子进行补充和仿真验证,简言之,吊书袋子. 2020-02-27 21:09:05 二 ...
- Codeforces Round #600 (Div. 2) - B. Silly Mistake(模拟)
题意:有一个公司,每天有员工进出,$a[i]>0$时表示$a[i]$这个员工进入公司,$a[i]<0$时表示$-a[i]$这个员工出公司,公司对进出办公室有一些严格的规定 员工每天最多只能 ...
- python闯关之路一(语法基础)
1,什么是编程?为什么要编程? 答:编程是个动词,编程就等于写代码,那么写代码是为了什么呢?也就是为什么要编程呢,肯定是为了让计算机帮我们搞事情,代码就是计算机能理解的语言. 2,编程语言进化史是 ...
- how to analyze jmeter results
https://octoperf.com/blog/2017/10/19/how-to-analyze-jmeter-results/
- Python 之并发编程之线程上
一.线程概念 进程是资源分配的最小单位 线程是计算机中调度的最小单位 多线程(即多个控制线程)的概念是,在一个进程中存在多个控制线程,多个控制线程共享该进程的地址空间,相当于一个车间内有多条流水线,都 ...
- MySQL 之单表查询
数据库数据: # (1) 创建数据表 create table employee( id int primary key auto_increment, emp_name char(12) not n ...
- GO 空白标识符 _
空白标识符 _ 也被用于抛弃值,如值 5 在:_, b = 5, 7 中被抛弃. _ 实际上是一个只写变量,你不能得到它的值.这样做是因为 Go 语言中你必须使用所有被声明的变量,但有时你并不需要使用 ...