ajax练习习题二三级联动

异步执行

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 "连接失败";
        }
    }
}