jquery ajax 同步异步的执行 return值不能取得的解决方案


Posted in Javascript onJanuary 08, 2012

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

代码

function getReturnAjax{ 
$.ajax({ 
type:"POST", 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", 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, 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", 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 相关文章推荐
js中eval()函数和trim()去掉字符串左右空格应用
Feb 02 Javascript
几种延迟加载JS代码的方法加快网页的访问速度
Oct 12 Javascript
JavaScript实现同一页面内两个表单互相传值的方法
Aug 12 Javascript
理解JS事件循环
Jan 07 Javascript
JavaScript中判断数据类型的方法总结
May 24 Javascript
深入理解JavaScript函数参数(推荐)
Jul 26 Javascript
Bootstrap优化站点资源、响应式图片、传送带使用详解3
Oct 14 Javascript
jQuery Validate设置onkeyup验证的实例代码
Dec 09 Javascript
ES6 Promise对象概念与用法分析
Apr 01 Javascript
Vue自定义事件(详解)
Aug 19 Javascript
对vue2.0中.vue文件页面跳转之.$router.push的用法详解
Aug 24 Javascript
Javascript和jquery在selenium的使用过程
Oct 31 jQuery
玩转jQuery按钮 请告诉我你最喜欢哪些?
Jan 08 #Javascript
分享几个超级震憾的图片特效
Jan 08 #Javascript
关于JAVASCRIPT urldecode URL解码的问题
Jan 08 #Javascript
JAVASCRIPT车架号识别/验证函数代码 汽车车架号验证程序
Jan 08 #Javascript
人人网javascript面试题 可以提前实现下
Jan 05 #Javascript
javascript是怎么继承的介绍
Jan 05 #Javascript
js 链式延迟执行DOME
Jan 04 #Javascript
You might like
解决file_get_contents无法请求https连接的方法
2013/12/17 PHP
PHP中把对象转换为关联数组代码分享
2015/04/09 PHP
js判断一个字符串是否包含一个子串的方法
2015/01/26 Javascript
checkbox批量选中,获取选中项的值的简单实例
2016/06/28 Javascript
浅谈Postman解决token传参的问题
2018/03/31 Javascript
详解Vue打包优化之code spliting
2018/04/09 Javascript
node.js 模块和其下载资源的镜像设置的方法
2018/09/06 Javascript
iview实现select tree树形下拉框的示例代码
2018/12/21 Javascript
微信小程序实现联动选择器
2019/02/15 Javascript
详解微信小程序-获取用户session_key,openid,unionid - 后端为nodejs
2019/04/29 NodeJs
详解关于React-Router4.0跳转不置顶解决方案
2019/05/10 Javascript
layui添加动态菜单与选项卡
2019/07/26 Javascript
Vue开发中遇到的跨域问题及解决方法
2020/02/11 Javascript
在vue中实现禁止回退上一步,路由不存历史记录
2020/07/22 Javascript
[02:09:59]火猫TV国士无双dota2 6.82版本详解(下)
2014/09/29 DOTA
Python中使用glob和rmtree删除目录子目录及所有文件的例子
2014/11/21 Python
举例详解Python中的split()函数的使用方法
2015/04/07 Python
用Python实现一个简单的线程池
2015/04/07 Python
python处理数据,存进hive表的方法
2018/07/04 Python
python  文件的基本操作 菜中菜功能的实例代码
2019/07/17 Python
用python wxpy管理微信公众号并利用微信获取自己的开源数据
2019/07/30 Python
python并发编程多进程之守护进程原理解析
2019/08/20 Python
使用tensorflow进行音乐类型的分类
2020/08/14 Python
canvas实现滑动验证的实现示例
2020/08/11 HTML / CSS
美国最大的户外装备和服装购物网站:Backcountry
2019/10/15 全球购物
解释一下抽象方法和抽象类
2016/08/27 面试题
建筑设计学生的自我评价
2014/01/16 职场文书
十岁生日父母答谢词
2014/01/18 职场文书
计算机学生求职信范文
2014/01/30 职场文书
商场中秋节活动方案
2014/02/07 职场文书
安全承诺书范文
2014/03/26 职场文书
大学毕业生个人自荐书
2014/07/02 职场文书
任命书格式模板
2015/09/22 职场文书
家庭教育培训学习心得体会
2016/01/14 职场文书
Python实现滑雪小游戏
2021/09/25 Python
docker-compose部署Yapi的方法
2022/04/08 Servers