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 ...
随机推荐
- IIS8中 出现ashx 401：未授权，uploadify上传文件失败
环境:阿里云服务器 windows2012 + IIS8 +asp.net 访问IIS 出现能正常访问aspx页面,但是通过ajax访问ashx上传文件的时候就出现ashx Status Code ...
- Visual Studio 2013
1.How to hide reference counts in VS2013? Tools--> Options --> Text Editor --> All Language ...
- 避免JS全局变量冲突
一.原则1.1 用匿名函数将脚本包起来1.2 使用命名空间(多级) 二.改进过程 2.1 原始数据(a.js和b.js都有全局变量window.a,导致冲突,全局变量属于window) //a.js& ...
- Linux进程栈和线程栈
参考资料: http://blog.csdn.net/xhhjin/article/details/7579145 总结: 1.进程的栈大小是在进程执行的时刻才能指定的,即不是在编译的时候决定 ...
- 使用JFinal-weixin配置微信开发
先扯点闲话,申请好公众号后,一直因为没有域名.没有外网IP而没有尝试过开发微信服务.后来发现nat123可以从内网直接映射到外网,但是nat123需要钱或者T币大于0,于是为了赚一个T币,签到灌水了一 ...
- UIResponder类
UIResponder类 UIResponder类是所有视图类的父类,包括UIView, UIApplication, UIWindow. UIResponder类定义了一些响应和处理事件的方法.事件 ...
- CSS兼容问题大全
1.chorme 最小字体的兼容性. 问题描述:ff和IE最小字体可设置为1px,可是chorme中文版最小字体是12px,小于12px的字体全部显示为12px.解决方案:chorme支持CSS3的, ...
- 对于Linux平台下C语言开发中__sync_函数的认识
reference:http://gcc.gnu.org/onlinedocs/gcc-4.1.0/gcc/Atomic-Builtins.html#Atomic-Builtins A built ...
- POJ3164 Command Network(最小树形图)
图论填个小坑.以前就一直在想,无向图有最小生成树,那么有向图是不是也有最小生成树呢,想不到还真的有,叫做最小树形图,网上的介绍有很多,感觉下面这个博客介绍的靠谱点: http://www.cnblog ...
- UITbaleView上按钮的单选
设置Id属性,标记是哪个cell @property (nonatomic,assign)NSInteger Id; 设置一个普通状态和选中状态图片不同的按钮 _choose = [[UIButton ...