三级联动

<!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" />
<title>无标题文档</title>
<script src="jquery-1.11.2.min.js"></script>
<script src="sanji.js"></script>
</head>

<body>
<div id="sanji"></div>
</body>
</html>

// JavaScript Document
$(document).ready(function(e) {

//将DIV里面写入三个下拉列表
$("#sanji").html("<select id='sheng'></select><select id='shi'></select><select id='qu'></select>");

//填充内容
//1.填充省
FillSheng();
//2.填充市
FillShi();
//3.填充区
FillQu();

//如果省选中变化的时候,去填充市和区
$("#sheng").change(function(){

//改变市
FillShi();
//改变区
FillQu();

})
//如果市选中变化的时候,去填充区
$("#shi").change(function(){

//改变区
FillQu();

})

//填充省的方法
function FillSheng()
{
//找到父级代号
var pcode = "0001";
//调用Ajax
$.ajax({

async:false,
url:"chuli.php",
data:{pcode:pcode},
type:"POST",
dataType:"TEXT",
success: function(data){

var str = "";
var hang = data.split("|");

for(var i=0; i<hang.length;i++)
{
var lie = hang[i].split("^");
str += "<option value='"+lie[0]+"'>"+lie[1]+"</option>";
}

$("#sheng").html(str);

}
});
}
//填充市的方法
function FillShi()
{
//找到父级代号
var pcode = $("#sheng").val();
//调用Ajax
$.ajax({
async:false,
url:"chuli.php",
data:{pcode:pcode},
type:"POST",
dataType:"TEXT",
success: function(data){
var str = "";
var hang = data.split("|");

for(var i=0; i<hang.length;i++)
{
var lie = hang[i].split("^");
str += "<option value='"+lie[0]+"'>"+lie[1]+"</option>";
}

$("#shi").html(str);
}
});
}

//填充区的方法
function FillQu()
{
//找到父级代号
var pcode = $("#shi").val();
//调用Ajax
$.ajax({
async:false,
url:"chuli.php",
data:{pcode:pcode},
type:"POST",
dataType:"TEXT",
success: function(data){
var str = "";
var hang = data.split("|");

for(var i=0; i<hang.length;i++)
{
var lie = hang[i].split("^");
str += "<option value='"+lie[0]+"'>"+lie[1]+"</option>";
}

$("#qu").html(str);
}
});
}

});

<?php
//取到传过来的父级代号
$pcode = $_POST["pcode"];
//引入数据操作类
include("DBDA.php");
$db = new DBDA();

//写SQL语句
$sql = "select AreaCode,AreaName,ParentAreaCode from ChinaStates where ParentAreaCode='{$pcode}'";
//执行
echo $db->StrQuery($sql);

最新文章

  1. CSS自适应布局(包括两边宽度固定中间宽度自适应与中间宽度固定两边宽度自适应)
  2. Javascript 笔记与总结(2-6)var
  3. html部分---样式表,选择器;
  4. Python中的注释(转)
  5. Springmvc+uploadify实现文件带进度条批量上传
  6. php分页类的二种调用方法(转载)
  7. ScriptManager局部刷新
  8. PAT (Advanced Level) 1011. World Cup Betting (20)
  9. ORACLE的Dead Connection Detection浅析
  10. IEnumerable和IQueryable接口
  11. Java基础—标识符及命名规范
  12. sublime text3简体中文版汉化教程
  13. jquery选择器和属性
  14. zabbix 3.2源码安装
  15. Linux下Python与C++混合编程
  16. ORA-01507: database not mounted
  17. MPI2 编程环境搭建 MPI4PY 编程环境搭建
  18. PHPCMS的产品筛选功能
  19. 【BZOJ1562】【NOI2009】变换序列(二分图匹配)
  20. lr11 controller打开提示cannot initialize driver dll,exiting

热门文章

  1. SpringMVC上传文件后返回文件服务器地址路径
  2. ReSharper warns: “Static field in generic type”
  3. 【bug】【userAgent】极速模式与非极速模式存在差异
  4. BZOJ_4800_[Ceoi2015]Ice Hockey World Championship_双指针
  5. 【POJ 1144】 Network
  6. 10 探索其他Excel对象
  7. 杂项-Java:FreeMarker
  8. bzoj4868
  9. 基于ELK的传感器数据分析练习
  10. bzoj 1702: [Usaco2007 Mar]Gold Balanced Lineup 平衡的队列【hash】