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 相关文章推荐
一步一步教你写一个jQuery的插件教程(Plugin)
Sep 03 Javascript
JQuery 1.6发布 性能提升,同时包含大量破坏性变更
May 10 Javascript
JS+flash实现chrome和ie浏览器下同时可以复制粘贴
Sep 22 Javascript
jQuery下的动画处理总结
Oct 10 Javascript
JavaScript如何获取数组最大值和最小值
Nov 18 Javascript
JS判断日期格式是否合法的简单实例
Jul 11 Javascript
jQuery展示表格点击变色、全选、删除
Jan 05 Javascript
js实现九宫格拼图小游戏
Feb 13 Javascript
Popup弹出框添加数据实现方法
Oct 27 Javascript
Three.js实现3D机房效果
Dec 30 Javascript
解决微信小程序中转换时间格式IOS不兼容的问题
Feb 15 Javascript
前端vue如何使用高德地图
Nov 05 Javascript
玩转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
生成静态页面的php函数,php爱好者站推荐
2007/03/19 PHP
PHP简单系统查询模块代码打包下载
2008/06/07 PHP
php下防止单引号,双引号在接受页面转义的设置方法
2008/09/25 PHP
php读取目录所有文件信息dir示例
2014/03/18 PHP
10个php函数实用却不常见
2015/10/13 PHP
PHP实现获取毫秒时间戳的方法【使用microtime()函数】
2019/03/01 PHP
PHP8.0新功能之Match表达式的使用
2020/07/19 PHP
JavaScript 学习笔记 Black.Caffeine 09.11.28
2009/11/30 Javascript
jQuery事件之键盘事件(ctrl+Enter回车键提交表单等)
2014/05/11 Javascript
chrome下jq width()方法取值为0的解决方法
2014/05/26 Javascript
使用jQuery和Bootstrap实现多层、自适应模态窗口
2014/12/22 Javascript
浅谈JavaScript Math和Number对象
2015/01/26 Javascript
iframe中使用jquery进行查找的方法【案例分析】
2016/06/17 Javascript
微信小程序 页面之间传参实例详解
2017/01/13 Javascript
Jquery与Bootstrap实现后台管理页面增删改查功能示例
2017/01/22 Javascript
js仿小米手机上下滑动效果
2017/02/05 Javascript
js 数据存储和DOM编程
2017/02/09 Javascript
js实现上下左右弹框划出效果
2017/03/08 Javascript
jQuery Collapse1.1.0折叠插件简单使用
2017/08/28 jQuery
微信小程序出现wx.navigateTo页面不跳转问题的解决方法
2017/12/26 Javascript
vue.js分页中单击页码更换页面内容的方法(配合spring springmvc)
2018/02/10 Javascript
JS实现移动端触屏拖拽功能
2018/07/31 Javascript
微信小程序云开发之新手环境配置
2019/05/16 Javascript
js canvas实现星空连线背景特效
2019/11/01 Javascript
跟老齐学Python之类的细节
2014/10/13 Python
Python的Django框架中settings文件的部署建议
2015/05/30 Python
python-opencv颜色提取分割方法
2018/12/08 Python
详解Python基础random模块随机数的生成
2019/03/23 Python
Python常用数字处理基本操作汇总
2020/09/10 Python
借助HTML5 Canvas来绘制三角形和矩形等多边形的方法
2016/03/14 HTML / CSS
JD Sports澳洲官网:英国领先的运动鞋和运动时尚零售商
2020/02/15 全球购物
餐饮管理自我介绍信
2014/01/15 职场文书
2015年综治宣传月活动总结
2015/03/25 职场文书
结婚堵门保证书
2015/05/08 职场文书
go xorm框架的使用
2021/05/22 Golang
关于JavaScript轮播图的实现
2021/11/20 Javascript