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

ajax练习习题二三级联动的更多相关文章
- 使用PHP+MySql+Ajax+jQuery实现省市区三级联动功能
使用PHP+MySql+Ajax+jQuery实现省市区三级联动功能 要求:写一个省市区(或者年月日)的三级联动,实现地区或时间的下拉选择. 实现技术:php ajax 实现:省级下拉变化时市下拉区下 ...
- 多级联动系列——ajax调用XML实现三级联动
ajax 使用起来特别的方便,再也不操心浏览器兼容问题了.用ajax调用XML页面中的内容,来生成三级联动,OK废话不多说,跟着我一步步写吧. 首先写一个XML文件.data.xml <?xml ...
- 【2017-06-06】Ajax完整结构、三级联动的制作
一.Ajax完整结构 $.ajax({ url:"Main.ashx", data:{}, dataType:"json", type:"post&q ...
- 用php+mysql+ajax+jquery做省市区三级联动
要求:写一个省市区(或者年月日)的三级联动,实现地区或时间的下拉选择. 实现技术:php ajax 实现:省级下拉变化时市下拉区下拉跟着变化,市级下拉变化时区下拉跟着变化. 使用chinastates ...
- ajax加php实现三级联动
js代码 <script type="text/javascript"> function get_next(t,pid){ //当前元素的id,当前optio ...
- Ajax做无刷新三级联动
1.引入JS and Jquery包 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " ...
- 如何用jquery+ajax写省市区的三级联动?(封装和不封装两种方式)-----2017-05-14
首先,要实现如下图效果, 1.要理清思路: 先做出三个下拉菜单----根据第一个下拉菜单的value值获取第二个下拉列表的内容,第三个同理. 2.用到的数据库表:Chinastates表 规律:根据国 ...
- ajax 城市区域选择三级联动
<body onLoad="sheng()"><div class="xqbody"> <form action=" ...
- Ajax省市地区下拉列表三级联动
SQL数据库表 --创建Province表 CREATE TABLE [dbo].[Province]( [Id] [int] NULL, [Name] [varchar](50) NULL, [or ...
随机推荐
- vs2012 condition_variable notify_one 崩溃
vs2012项目中用到 condition_variable系统方法,程序运行过程过程中偶尔出现notify_one崩溃, 程序运行的服务器系统版本是windows server 2008 R2 SP ...
- Gulp的安装
Gulp 是前端自动化开发工具,我们可以用它提高开发效率. 它有以下用途: 压缩js.压缩css.压缩less.压缩图片等功能 首先我们开始安装Gulp Gulp是基于node来实现的,所以应该先安装 ...
- SQL-行转列(PIVOT)实例1
--未旋转之前的查询结果 select s.Name ShiftName,h.BusinessEntityID,d.Name as DpartmentName from HumanResources. ...
- ios 5
1.屏幕尺寸568×2/320×2 需要一张568h@2x.png的图片. 2.iOS5不支持udid,用uuid替代,取得uuid方法: -(NSString*) uuid { CFUUIDRef ...
- Hbase的连接池--HTablePool被Deprecated之后
说明: 最近两天在调研HBase的连接池,有了一些收获,特此记录下来. 本文先将官方文档(http://hbase.apache.org/book.html)9.3.1.1节翻译,方便大家阅读,然 ...
- request 获取请求参数
/** * 根据request获取请求的用户参数 * @return * @return */ protected <T> T getParamConvertEntity(Class cl ...
- 禁用backspace键的后退功能
禁用backspace键的后退功能,但是可以删除文本内容<script language="JavaScript">document.onkeydown = check ...
- Selenium中expected_conditions下text_to_be_present_in_element_value方法的使用
text_to_be_present_in_element: 判断某个元素中的text是否包含了预期的字符串 text_to_be_present_in_element_value: 判断某个元素中的 ...
- hdu5017 Ellipsoid(旋转)
比赛的时候跳进这个大坑里,最后代码是写出来了.看到好像很多都是模拟退火做的,下面提供一个奇怪的思路吧. ax^2+by^2+cz^2+dyz+exz+fxy=1(*) 通过一些奇特的YY我们可以知道这 ...
- LA 3713
The Bandulu Space Agency (BSA) has plans for the following three space missions: Mission A: Landing ...