jquery ajax同步异步的执行最终解决方案


Posted in Javascript onApril 26, 2013

大家先看一段简单的jquery ajax 返回值的js
代码

function getReturnAjax{ 
$.ajax({ 
type:"POST", 
http://www.cnblogs.com/wlmemail/admin/%22ajax/userexist.aspx", 
data:"username="+vusername.value, 
success:function(msg){ 
if(msg=="ok"){ 
showtipex(vusername.id,"<img src='images/ok.gif'/><b><font color='#ffff00'>该用户名可以使用</font></b>",false) 
return true; 
} 
else 
{ 
showtipex(vusername.id,"<img src='images/cancel.gif'/><b><font color='#ffff00'>该用户已被注册</font></b>",false); 
vusername.className="bigwrong"; 
return false; 
} 
} 
}); 
}

但是我们调用这个getReturnAjax()发现始终取得的都是false,那就是说return true,return false根本没有起作用,在火狐下用firebug调试也证明,代码根本不会执行到return 部分。

我们试想在函数里先定义一个变量,然后在ajax里赋值,最后在函数的末尾返回这个变量,会不会有效果呢?我们把代码修改如下:
代码

function getAjaxReturn() 
{ 
var bol=false; 
$.ajax({ 
type:"POST", 
http://www.cnblogs.com/wlmemail/admin/%22ajax/userexist.aspx", 
data:"username="+vusername.value, 
success:function(msg){ 
if(msg=="ok"){ 
showtipex(vusername.id,"<img src='images/ok.gif'/><b><font color='#ffff00'>该用户名可以使用</font></b>",false) 
// return true; 
bol=true; 
} 
else 
{ 
showtipex(vusername.id,"<img src='images/cancel.gif'/><b><font color='#ffff00'>该用户已被注册</font></b>",false); 
vusername.className="bigwrong"; 
//return false; 
} 
} 
}); 
return bol; 
}

结果仍然不起作用。最后解决方案有2,如下
1、添加async:false.即修改为同步了,什么意思?(按同事解释就是,这是等这个ajax有了返回值后才会执行下面的js。一语道破天机,怪不得以前很多ajax调用里面的赋值都不起作用)。这样等ajax给bol赋值完毕后,才执行下面的js部分。而刚刚异步的话,还没有来得及赋值,就已经return了。
代码
function getAjaxReturn() 
{ 
var bol=false; 
$.ajax({ 
type:"POST", 
async:false, 
http://www.cnblogs.com/wlmemail/admin/%22ajax/userexist.aspx", 
data:"username="+vusername.value, 
success:function(msg){ 
if(msg=="ok"){ 
showtipex(vusername.id,"<img src='images/ok.gif'/><b><font color='#ffff00'>该用户名可以使用</font></b>",false) 
// return true; 
bol=true; 
} 
else 
{ 
showtipex(vusername.id,"<img src='images/cancel.gif'/><b><font color='#ffff00'>该用户已被注册</font></b>",false); 
vusername.className="bigwrong"; 
//return false; 
} 
} 
}); 
return bol; 
}

2、 通过传入一个函数解决这个问题。
代码
function getAjaxReturn(success_function,fail_function) 
{ 
var bol=false; 
$.ajax({ 
type:"POST", 
http://www.cnblogs.com/wlmemail/admin/%22ajax/userexist.aspx", 
data:"username="+vusername.value, 
success:function(msg){ 
if(msg=="ok"){ 
showtipex(vusername.id,"<img src='images/ok.gif'/><b><font color='#ffff00'>该用户名可以使用</font></b>",false) 
success_function(msg); 
} 
else 
{ 
showtipex(vusername.id,"<img src='images/cancel.gif'/><b><font color='#ffff00'>该用户已被注册</font></b>",false); 
vusername.className="bigwrong"; 
fail_function(msg); 
//return false; 
} 
} 
}); 
function success_function(info) 
{ 
//do what you want do 
alert(info); 
} 
funciont fail_function(info) 
{ 
//do what you want do 
alert(info); 
}
Javascript 相关文章推荐
jQuery(1.3.2) 7行代码搞定跟随屏幕滚动的层
May 21 Javascript
jquery 快速回到页首的方法
Dec 05 Javascript
jquery插件jquery倒计时插件分享
Dec 27 Javascript
jQuery中bind与live的用法及区别小结
Jan 27 Javascript
js图片自动轮播代码分享(js图片轮播)
May 06 Javascript
jQuery中Ajax全局事件引用方式及各个事件(全局/局部)执行顺序
Jun 02 Javascript
原生js实现焦点轮播图效果
Jan 12 Javascript
微信小程序手势操作之单触摸点与多触摸点
Mar 10 Javascript
基于js文件加载优化(详解)
Jan 03 Javascript
js中的数组对象排序分析
Dec 11 Javascript
javascript数据类型中的一些小知识点(推荐)
Apr 18 Javascript
微信小程序修改checkbox的样式代码实例
Jan 21 Javascript
html中使用javascript调用本地程序(exe、doc等)实现代码
Apr 26 #Javascript
JQuery的Ajax跨域请求原理概述及实例
Apr 26 #Javascript
jquery实现textarea输入字符控制(仿微博输入控制字符)
Apr 26 #Javascript
表单类各种类型(文本框)失去焦点效果jquery代码
Apr 26 #Javascript
基于jquery中children()与find()的区别介绍
Apr 26 #Javascript
基于jQuery选择器的整理集合
Apr 26 #Javascript
Google Map V3 绑定气泡窗口(infowindow)Dom事件实现代码
Apr 26 #Javascript
You might like
让你的PHP同时支持GIF、png、JPEG
2006/10/09 PHP
javascript中方便增删改cookie的一个类
2012/10/11 Javascript
javascrpt绑定事件之匿名函数无法解除绑定问题
2012/12/06 Javascript
Jquery刷新页面背景图片随机变换的实现方法
2013/03/15 Javascript
javascript记录文本框内文字个数检测文字个数变化
2014/10/14 Javascript
jQuery实现菜单式图片滑动切换
2015/03/14 Javascript
javascript引用类型指针的工作方式
2015/04/13 Javascript
关于js原型的面试题讲解
2016/09/25 Javascript
Swiper实现轮播图效果
2017/07/03 Javascript
JS弹窗 JS弹出DIV并使整个页面背景变暗功能的实现代码
2018/04/21 Javascript
vue-cli 打包后提交到线上出现 &quot;Uncaught SyntaxError:Unexpected token&quot; 报错
2018/11/06 Javascript
微信小程序自定义toast组件的方法详解【含动画】
2019/05/11 Javascript
微信小程序实现侧边栏分类
2019/10/21 Javascript
小程序自定义模板实现吸顶功能
2020/01/08 Javascript
手写Vue2.0 数据劫持的示例
2021/03/04 Vue.js
Python面向对象编程基础解析(二)
2017/10/26 Python
深入理解Python单元测试unittest的使用示例
2017/11/18 Python
PyQt5每天必学之工具提示功能
2018/04/19 Python
Jupyter notebook远程访问服务器的方法
2018/05/24 Python
详解Python用户登录接口的方法
2019/04/17 Python
用uWSGI和Nginx部署Flask项目的方法示例
2019/05/05 Python
Tensorflow中k.gradients()和tf.stop_gradient()用法说明
2020/06/10 Python
DERMAdoctor官网:美国著名皮肤护理品牌
2019/07/06 全球购物
求网格中的黑点分布
2013/11/06 面试题
什么是跨站脚本攻击
2014/12/11 面试题
路政管理专业推荐信
2013/11/11 职场文书
工地安全检查制度
2014/02/04 职场文书
保安队长职务说明书
2014/02/23 职场文书
企业办公室岗位职责
2014/03/12 职场文书
植树造林的宣传标语
2014/06/23 职场文书
小学捐书活动总结
2014/07/05 职场文书
老公写给老婆的检讨书
2015/05/06 职场文书
2015年销售助理工作总结
2015/05/11 职场文书
党员读书活动心得体会
2016/01/14 职场文书
Mac环境Nginx配置和访问本地静态资源的实现
2021/03/31 Servers
Python 数据可视化工具 Pyecharts 安装及应用
2022/04/20 Python