异步执行

1数据传输收发数据的时候不用等待对方接受，可以继续发送

2Ajax 在调用处理页面处理数据的时候，下面的代码可以继续执行，效率高

同步执行

1收发数据的时候要等到对方接受的成功，才可以继续发送下一个

2ajax 在调用处理页面数据的时候，下面的代码不能执行，只有当ajax完全执行完之后，才能继续执行下面代码

Async ：false 关闭异步，开启同步

显示页面

<!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 type="text/javascript" src="../../popwindow/jquery-1.11.2.min.js"></script>

</head>

<body>

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

</body>

<script type="text/javascript">

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

    //创建表单

 var zhuti="<select size='1' id='sheng'></select><select size='1' id='shi'></select><select size='1' id='qu'></select>";

      $("#sanji").html(zhuti);

      //填充sheng

        FillSheng();

      //填充shi

        FillShi();

      //填充qu

        Fillqu();

        //当选中省变化的时候去填充市和区

        $("#sheng").change(function(e) {

            //填充shi

        FillShi();

      //填充qu

        Fillqu();

         });

        //当市选中的时候去选中区

        $("#shi").change(function(e) {

           //填充qu

        Fillqu();

        });

});

function FillSheng()

{

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

    //调用ajax

    $.ajax({

        async:false,//关闭同步开启同步关闭异步

          url:"chuli.php",

        type:"POST",

        dataType:"text" ,

        data:{pcode:pcode},

        success: function(data)

    {     //拆分返回的字符串，得到的行的数组

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

        var str="";

         for(var i=; i<hang.length;i++)

         {

            var lie= hang[i].split("^");

            str=str+"<option value='"+lie[]+"'>"+lie[]+"</option>";

         }

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

    }

    });

}

function FillShi()

{

    var pcode=$("#sheng").val(); //市的父级代号

    //调用ajax

    $.ajax({

        async:false,//开启同步关闭异步

          url:"chuli.php",

        type:"POST",

        dataType:"text" ,

        data:{pcode:pcode},

        success: function(data)

    {    //拆分返回的字符串，得到的行的数组

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

        var str="";

         for(var i=; i<hang.length;i++)

         {

            var lie= hang[i].split("^");

            str=str+"<option value='"+lie[]+"'>"+lie[]+"</option>";

         }

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

    }

    });

}

function Fillqu()

{

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

    //调用ajax

    $.ajax({

        async:false,//关闭同步开启同步关闭异步

          url:"chuli.php",

        type:"POST",

        dataType:"text" ,

        data:{pcode:pcode},

        success: function(data)

    {     //拆分返回的字符串，得到的行的数组

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

          var str="";

         for(var i=; i<hang.length;i++)

         {

            var lie= hang[i].split("^");

            str=str+"<option value='"+lie[]+"'>"+lie[]+"</option>";

         }

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

    }

    });

}

</script>

</html>

处理页面

<?php

//接受父级代号

$pcode=$_POST["pcode"];

include ("../DBDA.class.php");

$db=new DBDA();

//根据父代号查询

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

echo $db->StrQuery($sql);

封装类

<?php

class DBDA

{

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

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

    public $pwd="";             //密码

    public $dbconnect; //连接对象

    //操作数据库的方法

    //$sql代表需要执行的SQL语句

    //$type代表SQL语句的类型，1代表查询，2代表增删改

    //$dbname代表要操作的数据库名称

    //如果是查询，返回二维数组

    //如果是增删改，返回true或false

    /*ajax text 返回类型*/

    public function StrQuery($sql,$type=,$dbname="")

    {

        //造连接对象

        $this->dbconnect= new MYSQLi($this->host,$this->uid,$this->pwd,$dbname);

        if (!mysqli_connect_error())

        {

            //如果连接成功，执行sql语句

            $result = $this->dbconnect->query($sql);

            //根据语句判断

            if($type==)

            {

                $attr=$result->fetch_all();

                $str="";

                    //如果是查询语句返回字符串

                for($i=;$i<count($attr);$i++)

                {

                    for($j=;$j<count($attr[$i]);$j++)

                    {

                    $str = $str.$attr[$i][$j];

                    $str = $str."^";

                    }

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

                    $str = $str."|";

                }

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

                return $str;

            }

            else

            {

                    //如果是其他语句,返回true或false

            if($result){

                return "OK";

            }else{

                return "NO";

            }

            }

        }

        else

        {

             return "连接失败";

        }

    }

}

ajax练习习题二三级联动的更多相关文章

  1. 使用PHP+MySql+Ajax+jQuery实现省市区三级联动功能

    使用PHP+MySql+Ajax+jQuery实现省市区三级联动功能 要求:写一个省市区(或者年月日)的三级联动,实现地区或时间的下拉选择. 实现技术:php ajax 实现:省级下拉变化时市下拉区下 ...

  2. 多级联动系列——ajax调用XML实现三级联动

    ajax 使用起来特别的方便,再也不操心浏览器兼容问题了.用ajax调用XML页面中的内容,来生成三级联动,OK废话不多说,跟着我一步步写吧. 首先写一个XML文件.data.xml <?xml ...

  3. 【2017-06-06】Ajax完整结构、三级联动的制作

    一.Ajax完整结构 $.ajax({ url:"Main.ashx", data:{}, dataType:"json", type:"post&q ...

  4. 用php+mysql+ajax+jquery做省市区三级联动

    要求:写一个省市区(或者年月日)的三级联动,实现地区或时间的下拉选择. 实现技术:php ajax 实现:省级下拉变化时市下拉区下拉跟着变化,市级下拉变化时区下拉跟着变化. 使用chinastates ...

  5. ajax加php实现三级联动

    js代码 <script type="text/javascript">    function get_next(t,pid){  //当前元素的id,当前optio ...

  6. Ajax做无刷新三级联动

    1.引入JS and Jquery包 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " ...

  7. 如何用jquery+ajax写省市区的三级联动？（封装和不封装两种方式）-----2017-05-14

    首先,要实现如下图效果, 1.要理清思路: 先做出三个下拉菜单----根据第一个下拉菜单的value值获取第二个下拉列表的内容,第三个同理. 2.用到的数据库表:Chinastates表 规律:根据国 ...

  8. ajax 城市区域选择三级联动

    <body onLoad="sheng()"><div class="xqbody">    <form action=" ...

  9. Ajax省市地区下拉列表三级联动

    SQL数据库表 --创建Province表 CREATE TABLE [dbo].[Province]( [Id] [int] NULL, [Name] [varchar](50) NULL, [or ...

随机推荐

  1. [转载]char * 和char []的区别---之第一篇

    char *  和char []的区别---之第一篇 原文地址http://blog.csdn.net/yahohi/article/details/7427724 在C/C++中,指针和数组在很多地 ...

  2. RobotFramework-调用.py文件

    RobotFramework-调用.py文件,直接运行: 注意:文件路径的\全部换成好了/

  3. HDU 5293 Tree chain problem 树形dp+dfs序+树状数组+LCA

    题目链接: http://acm.hdu.edu.cn/showproblem.php?pid=5293 题意: 给你一些链,每条链都有自己的价值,求不相交不重合的链能够组成的最大价值. 题解: 树形 ...

  4. Linux sort --copy

    Source: http://www.cnblogs.com/51linux/archive/2012/05/23/2515299.html sort是在Linux里非常常用的一个命令,管排序的,集中 ...

  5. map初始化定时器

    init_timer(); //各种定时器的初始化 void Map::init_timer() { //auto tf = GetPlug(TimerFactory); auto tf = m_sp ...

  6. .NET设计模式（14）：代理模式（Proxy Pattern）（转）

    摘要:在软件系统中,有些对象有时候由于跨越网络或者其他的障碍,而不能够或者不想直接访问另一个对象,如果直接访问会给系统带来不必要的复杂性,这时候可以在客户程序和目标对象之间增加一层中间层,让代理对象来 ...

  7. ASP.NET输出PNG图片时出现GDI+一般性错误的解决方法

    偶原来的用ASP.NET生成验证码图片时用的是JPG格式,今天想把它改成PNG格式的,结果就出现GDI+一般性错误,查了N久资料,才发现解决的办法,对分享此解决办法的网友深表感谢 Response.C ...

  8. Css选择器的优先级

    a = 行内样式style. b = ID选择器的数量. c = 类.伪类和属性选择器的数量. d = 类型选择器和伪元素选择器的数量. 选择器 等级(a,b,c,d) style=”” 1,0,0, ...

  9. javascript实现数据结构与算法系列：栈 -- 顺序存储表示和链式表示及示例

    栈(Stack)是限定仅在表尾进行插入或删除操作的线性表.表尾为栈顶(top),表头为栈底(bottom),不含元素的空表为空栈. 栈又称为后进先出(last in first out)的线性表. 堆 ...

  10. POJ1474 Video Surveillance(半平面交)

    求多边形核的存在性,过了这题但是过不了另一题的,不知道是模板的问题还是什么,但是这个模板还是可以过绝大部分的题的... #pragma warning(disable:4996) #include & ...