PHP语言 -- 三级联动

AreaCode  AreaName ParentAreaCode

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

<h1>三级联动</h1>
<div id="sanji"></div>

</body>

sanji.js

Ajax的同步,同步就是指在AJAX处理数据的时候,必须等到处理完成才能执行的语句,

Ajax的异步,异步就是指在AJAX处理数据的时候,不用等到处理完,下面的语句就可以执行

非Ajax

同步在交换信息的时候,必须等到对方确认接收之后在发送下一条

异步在交换信息的时候,只管向对方发送,不用管对方有没有答复

线程上

同步相当于单线程处理一个请求

异步相当于多线程同时处理多个请求

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

//在DIV里面早三个下拉
$("#sanji").html("<select id=‘sheng‘></select><select id=‘shi‘></select><select id=‘qu‘></select>");

//填充数据
FillSheng(); //填充省的数据
FillShi(); //填充市的数据
FillQu(); //填充区的数据

//填充省的方法
function FillSheng()
{
var code ="0001"; //省的父级代号

//调用AJAX查询省的数据
$.ajax({async:false,    //将异步AJAX变成同步AJAX
url:"chuli.php",
data:{code:code},
type:"POST",
datatype:"TEXT",
success:function(){
//拆分字符串,返回行的数组var hang = data.split("|");

var str="";for(var i=0;i<hang.lenght;i++){var lie = hang[i].split("^");

str+="<option value=‘"+lie[0]+"‘>"+lie[1]+"</option>";}//将所有的option放到省下拉列表里面$("#sheng").html(str);}

});
}

function FillShi(){
var code =$("#sheng").val(); //市的父级代号

//调用AJAX查询省的数据
$.ajax({

async:false,
url:"chuli.php",
data:{code:code},
type:"POST",
datatype:"TEXT",
success:function(){
//拆分字符串,返回行的数组var hang = data.split("|");

var str="";for(var i=0;i<hang.lenght;i++){var lie = hang[i].split("^");

str+="<option value=‘"+lie[0]+"‘>"+lie[1]+"</option>";}//将所有的option放到市下拉列表里面$("#shi").html(str);}

});
}
function Fillqu(){

var code =$("#shi").val(); //区的父级代号

//调用AJAX查询省的数据
$.ajax({

async:false,
url:"chuli.php",
data:{code:code},
type:"POST",
datatype:"TEXT",
success:function(){
//拆分字符串,返回行的数组var hang = data.split("|");

var str="";for(var i=0;i<hang.lenght;i++){var lie = hang[i].split("^");

str+="<option value=‘"+lie[0]+"‘>"+lie[1]+"</option>";}//将所有的option放到市下拉列表里面$("#qu").html(str);}

});

}

//当省的选中发生变化的时候,去改变市和区$("#sheng").change(function(){FillShi();FillQu();})//当市的选中发生变化的时候去改变区$("#shi").change(function(){FillQu();})
});

chuli.php

<?php

include "DBDA.php";

$db = new DBDA();

$pcode = $_POST["code"];

$sql = "select AreaCode,AreaName from ChinaStates where ParentAreaCode = ‘{$pcode}‘";

echo $db->StrQuery($sql);
时间: 2024-10-19 07:41:39

PHP语言 -- 三级联动的相关文章

ajax连接数据库加载+三级联动

ajax连接数据库加载 ajax是指一种创建交互式网页应用的网页开发技术. AJAX = 异步JS和XML(标准通用标记语言的子集). AJAX 是一种用于创建快速动态网页的技术. 通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新.这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新. 传统的网页(不使用 AJAX)如果需要更新内容,必须重载整个网页页面. 优点:是在不重新加载整个页面的情况下,可以与服务器交换数据并更新部分网页内容. 不需要任何浏览器插件,但需要

day01课程回顾,数据类型,(用户登录限制登录三次,购物车,省市县三级联动)

Day01 Python的分类 Cpython:代码àc字节码->机器码   一行一行的编译执行 Pypy:   代码àc字节码->机器码   全部转换完再执行 其他python  代码-->其他字节码-->机器码 Python的执行 Windows:C:\Python35\python.exe    D:\1.txt(python可执行文件路径---解释器   执行文件) Linux:可以在文件的头部写#!/usr/bin/python    python安装路径(用命令wher

easyUI下拉列表三级联动

首先是先想好数据库的搭建,通过地区id,地区名称,上级地区id就可以实现,所有省市区的数据 例如: DAO层 service层 Servlet 页面 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>修改员工</title> <!-- 顺序不可以乱 --> <!-- 1.jQuery的js包 --> <script

Easyui表单之下拉列表的三级联动

一.实现三级联动需要连接数据库 二.需要JSON数据的解析 三.需要Servlet类与界面相对应值的传递 1. 界面层需要的代码如下: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <!-- 1 JQuery的js包 --> <script type="text/

js中的省市区三级联动

想要实现省市区的三级联动,首先需要的是一个下拉框,这个下拉框用我们的<select>标签就能实现,具体如下: <select id="province" onchange="chooseProvince(this)"> <option value="1">请选择省</option> </select><select id="city" onchange=&quo

ajax简介以及用ajax做的三级联动小练习

ajax基本结构: 1 var name = $("#text_1").val(); 2 $.ajax({ 3 url: "Ashxs/Handler.ashx",//一般处理程序路径 4 data: { "name": name },//要传输的数据,冒号前面是键名后面是要传输的数据,如果有多条数据在大括号内用逗号拼接 5 type: "post",//传输方式 6 dataType: "json",//

用DropDownList实现的省市级三级联动

这是一个用DropDownList 实现的省市级三级联动,记录一下········ <asp:ScriptManager ID="ScriptManager1" runat="server">/asp:ScriptManager> <asp:UpdatePanel ID="UpdatePanel1" runat="server">                          <Cont

Hibernate+struts+JqueryAjax+jSON实现无刷新三级联动

看网上JqueryAjax三级联动的例子讲不是很全,代码也给的不是很全,给初学者带来一定的难度.小弟自己写了一个,可能有些地方不是很好,希望大家能够提出建议. 用的是Hibernate+struts2写的.http://blog.csdn.net/luckey_zh/article/details/22995389 以代码来说话吧. 首先是index1.jsp页面 [html] view plaincopy <%@ page language="java" import=&quo

层的三级联动

/部门下拉选单绑定数据        function CreateDeptEntity(dataList) {            var select = "#setdept";            jQuery(select).empty();            jQuery(select).append("<OPTION value=0>请选择</OPTION>");            if (dataList != nu