使用ajax php运行顺序,jquery中ajax执行顺序调整

这次给大家带来jquery中ajax执行顺序调整,jquery中ajax执行顺序调整的注意事项有哪些,下面就是实战案例,一起来看一下。

今天在做用户注册时:发现了一个奇怪的问题,请看代码:$('input[name="username"]').blur(function(){

//验证格式

var pattern = /^[a-z][\w]{4,11}$/i;

if(!pattern.test($(this).val())) {

$(this).siblings('.desc').html('5-12个字符,必须以字母开头,只能输入数字,字母和下划线');

return false;

}

//验证用户名是否被注册

$.post('register.php?act=checkUser',{username:$(this).val()},function(data){

if(data.status == 'error') {

$('input[name="username"]').siblings('.desc').html(''+data.info+'');

return false;

}

},'json');

//成功

alert('成功');

//$(this).siblings('.desc').html('ok.gif');

});

按道理说,上面的格式是

1、验证用户名是否符合格式

2、格式正确再AJAX判断用户名是否被占用,

3、都成功则显示正确的图标,

但是问题是当我验证用户格式成功了之后,它就直接执行了,alert('成功'),然后再执行ajax,这是为什么呢?是ajax执行的时间问题吗?还是别的???

这是PHP代码:if($_GET['act'] == 'checkUser') {

if($_SERVER['HTTP_X_REQUESTED_WITH'] !== 'XMLHttpRequest') exit('非法操作!!!');

$sql = "SELECT id FROM {$sys_vars['db_pre']}user WHERE username='{$_POST['username']}'";

$result = mysql_query($sql);

$data = mysql_fetch_assoc($result);

if ($data) {

exit(json_encode(array('status'=>'error','info'=>'该用户名已被注册!!!')));

}else{

exit(json_encode(array('status'=>'success')));

}

}

分析如下

ajax是异步操作,当执行ajax相关功能函数时,系统先返回函数,再进行请求,当收到请求结果,会通过调用回调函数的方式返回给用户。$('input[name="username"]').blur(function(){

//验证格式

var pattern = /^[a-z][\w]{4,11}$/i;

if(!pattern.test($(this).val())) {

$(this).siblings('.desc').html('5-12个字符,必须以字母开头,只能输入数字,字母和下划线');

return false;

}

//验证用户名是否被注册

$.post('register.php?act=checkUser',{username:$(this).val()},function(data){

if(data.status == 'error') {

$('input[name="username"]').siblings('.desc').html(''+data.info+'');

return false;

}

},

function(data){ //对于post函数,第三个参数为回调函数

alert('成功');

}

,'json');

//成功

//alert('成功');

//$(this).siblings('.desc').html('ok.gif');

});

照这样修改一下,试试,体会一下不同之处。

不同的ajax函数 其回调函数的使用方法略有不同,可参考w3school的教程或jQuery官网。

这个其实是js的同步和异步的问题,异步的话你可以想象一下两条线路

复制代码 代码如下:

--执行函数调用--正则验证--发起ajax--函数返回 ajax回调

| |

| |

浏览器请求--php处理--浏览器接到结果

如果想让函数返回在ajax回调之后,可以改变上边的模型,例如:

复制代码 代码如下:

--执行函数调用--正则验证--发起ajax ajax回调--函数返回

| |

| |

浏览器请求--php处理--浏览器接到结果

这个可以通过修改jquery的发起ajax是异步还是同步方式来实现!$('input[name="username"]').blur(function(){

//验证格式

var pattern = /^[a-z][\w]{4,11}$/i;

if(!pattern.test($(this).val())) {

$(this).siblings('.desc').html('5-12个字符,必须以字母开头,只能输入数字,字母和下划线');

return false;

}

//验证用户名是否被注册

var ajaxCheckUser = false;

$.ajax({

type: "POST",

url: "register.php?act=checkUser",

data: {username:$(this).val()},

// 注意这里

async:false

success: function(data){

if(data.status == 'error') {

$('input[name="username"]').siblings('.desc').html(''+data.info+'');

//return false;

} else {

ajaxCheckUser = true;

}

},'json');

if(ajaxCheckUser) {

//成功

alert('成功');

//$(this).siblings('.desc').html('ok.gif');

}

});

相信看了本文案例你已经掌握了方法,更多精彩请关注php中文网其它相关文章!

推荐阅读:

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值