全国省市县查询

html代码

<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>无标题文档</title>

	<script src="../jquery-1.11.2.min.js"></script>

    <script src="sanji.js"></script>

</head>

<body>

    <h1>区域查询</h1>

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

</body>

</html>

js代码实现各区市随省的变化而变化

$(document).ready(function(e) {

    $("#sanji").html("<select id='sheng'></select><select id='shi'></select><select id='qu'></select>");//将三个下拉的字符串交给前边的div

    tiansheng();//加载省的数据

    tianshi();//加载市的数据

    tianqu();//加载区 的数据

    $("#sheng").change(function(){//变化后执行

		tianshi();//重新加载市

		tianqu();//重新加载区

    })

    $("#shi").change(function(){//变化后执行

		tianqu();//加载区的数据

    })

});

function tiansheng(){

	var pcode = "0001"; //找出省的父级代号

	$.ajax({

		async:false,//同步加载

		url:"states.php",

		data:{pcode:pcode},

		type:"POST",

		dataType:"TEXT",

		success: function(data){

		var hang = data.split("|");//拆分行

		var str = "";

			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 tianshi(){

    var pcode = $("#sheng").val();//找市的父级代号，省选中项的值

    $.ajax({

		async:false,//同步加载

		url:"states.php",

		data:{pcode:pcode},

		type:"POST",

		dataType:"TEXT",

		success: function(data){

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

			var str = "";

			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 tianqu(){

    var pcode = $("#shi").val();//找区的父级代号，市选中项的值

    $.ajax({

		url:"states.php",

		data:{pcode:pcode},

		type:"POST",

		dataType:"TEXT",

		success: function(data){

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

			var str = "";

				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"];

require "DBDA.class.php";

$db = new DBDA();

$sql = "select * from chinastates where parentareacode='{$pcode}'";

echo $db->strquery($sql);

DBDA封装功能

<?php

class DBDA{

	public $host="localhost"; //服务器地址

	public $uid="root"; //用户名

	public $pwd="123"; //密码

	public $dbname="crud"; //数据库名称

	public function query($sql,$type=0){

		$db = new MySQLi($this->host,$this->uid,$this->pwd,$this->dbname);

		$result = $db->query($sql);

		if($type){

			return $result;

		}else{

			return $result->fetch_all();

		}

	}

	public function strquery($sql,$type=0){

		$db = new MySQLi($this->host,$this->uid,$this->pwd,$this->dbname);

		$result = $db->query($sql);

		if($type){

			return $result;

		}else{

			$arr = $result->fetch_all();

			$str ="";

			foreach($arr as $v){

				$str .= implode("^",$v)."|";

			}

			$str = substr($str,0,strlen($str)-1);

			return $str;

		}

	}

}

Ajax三级联动的更多相关文章

  1. ajax验证表单元素规范正确与否 ajax展示加载数据库数据 ajax三级联动

    一.ajax验证表单元素规范正确与否 以用ajax来验证用户名是否被占用为例 1创建表单元素<input type="text" id="t"> 2 ...

  2. 使用 AJAX + 三级联动 实现分类出全国各地的省，市，区

    使用AJAX + 三级联动  实现分类出全国各地的省,市,区 也可以将下面的显示页面所写的 function循环,封装成js文件,就是在写代码软件里创建一个js文件,就和创建一个HTML或php文件一 ...

  3. AJAX 三级联动

    新的封装类 <?php class DBDA { public $host="localhost";//服务器地址 public $uid="root"; ...

  4. ajax三级联动下拉菜单

    ajax写三级联动,先写一个文件类吧,以后用的时候直接调用即可: 来找一张表: 实现: 中国地域的三级联动:省.市.区: 图: 说一下思路: (1)当用户选择省份的时候触发事件,把当前的省份的id通过 ...

  5. 0509 关于Ajax + 三级联动示例

    关于Ajax 1.干什么的? ajax负责抓取用户名信息,传递给服务器进行校验: 2.属性: onreadystatechange:事件,该事件可以感知ajax状态(readyState)的变化.aj ...

  6. [Ajax三级联动 无刷新]

    三级联动 的效果图 html页面: <body> <label class="fl">区域:</label> <select class= ...

  7. 2019.03.25 Ajax三级联动

    所谓三级联动就是,一层接着一层,根据上一层的选择给出这一层的结果 如选择市之后,会给出相应的区,然后到相应的县这就是联动 配置视图 ​from django.core import serialize ...

  8. ajax 三级联动商品分类（转载）

    转载  自  jines     http://www.cnblogs.com/lijinblogs/p/5759399.html 思路分析:效果:当页面加载时,利用ajax异步向后台请求数据,加载一 ...

  9. 原生javascript AJAX 三级联动

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

随机推荐

  1. piano class 12

    1,不要记谱子,眼睛要一直看着谱子,手指凭感觉找琴键 2,弹的时候一定要按照谱子上标出来的指法弹奏,很重要 3,两只手要会跷跷板弹奏 4,八分音符,一般第二个会比第一个弱一点,但是要看自己感觉 5,慢 ...

  2. SR锁存器

    CRM(临界连续模式)BOOST PFC 电路控制系统 SR锁存器 S和R都等于0的时候为什么有两个不同的Q?正因为这样才叫锁存器.Q’是Q的取反,不可能相同.Q*和Q‘不一样.Q是Q*的前一个状态. ...

  3. HTML5上传文件显示进度

    下面我们使用Html 5的新特性file api实现上传文件,并显示上传文件进度百分比.意图是这样的,当选择文件时,显示当前文件信息.这里我们是结合Asp.net MVC做为服务端,您也可以是其它的服 ...

  4. 关于jquery中on绑定click事件在苹果手机失效的问题

    用一个div当做了一个按钮来使用. <div class="button"> <div class=" next_button button_left ...

  5. es分词器

    1.默认的分词器 standard standard tokenizer:以单词边界进行切分standard token filter:什么都不做lowercase token filter:将所有字 ...

  6. java应用零停机，时间索引重建（reindex）

    一个field的设置是不能被修改的,如果要修改一个Field,那么应该重新按照新的mapping,建立一个index,然后将数据批量查询出来,重新用bulk api写入index中 批量查询的时候,建 ...

  7. VS Code 创建代码段 Snippets

    菜单:文件 -> 首选项 -> 用户代码片断 打开User Snippets菜单: 选择C#: 然后把里面注释的文字留下, 复制其中那段代码并修改称自己的代码段: "Create ...

  8. 【叶问】MySQL误删除frm文件该怎么办？

    MySQL误删除frm文件该怎么办?情况一:误删后还未重启MySQL1.从proc中恢复.frm文件cp /proc/`pidof mysqld`/fd/误删除的.frm /datadir/db/对应 ...

  9. MySQL安装失败解决的方法

    一..msi版的MySQL安装包在最后执行的时候到第三步就死掉了,直接未响应 watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvd19iYXNrZXRib3ky ...

  10. 报错解决——ctypes.ArgumentError: argument 1:……….. : wrong type

    运行 python darknet.py 结果报错如下: Traceback (most recent call last): File “darknet.py”, line 136, in net ...