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 相关文章推荐
IE6不能修改NAME问题的解决方法
Sep 03 Javascript
jquery中dom操作和事件的实例学习 仿yahoo邮箱登录框的提示效果
Nov 30 Javascript
极力推荐一款小巧玲珑的可视化编辑器bootstrap-wysiwyg
May 27 Javascript
一篇文章搞定JavaScript类型转换(面试常见)
Jan 21 Javascript
vue 文件目录结构详解
Nov 24 Javascript
Vue+Flask实现简单的登录验证跳转的示例代码
Jan 13 Javascript
vue2.0 实现页面导航提示引导的方法
Mar 13 Javascript
Vue-axios-post数据后端接不到问题解决
Jan 09 Javascript
Javascript实现秒表计时游戏
May 27 Javascript
vue addRoutes路由动态加载操作
Aug 04 Javascript
JS实现百度搜索框
Feb 25 Javascript
处理canvas绘制图片模糊问题
May 11 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读注册表
2006/10/09 PHP
MySQL中create table语句的基本语法是
2007/01/15 PHP
Javascript异步表单提交,图片上传,兼容异步模拟ajax技术
2010/05/10 Javascript
jsvascript图像处理—(计算机视觉应用)图像金字塔
2013/01/15 Javascript
js 使FORM表单的所有元素不可编辑的示例代码
2013/10/17 Javascript
js中split函数的使用方法说明
2013/12/26 Javascript
怎么通过onclick事件获取js函数返回值(代码少)
2015/07/28 Javascript
微信小程序 跳转方式总结
2017/04/20 Javascript
移动端web滚动分页的实现方法
2017/05/05 Javascript
jQuery扩展_动力节点Java学院整理
2017/07/05 jQuery
JS正则表达式完美实现身份证校验功能
2017/10/18 Javascript
微信小程序ajax实现请求服务器数据及模版遍历数据功能示例
2017/12/15 Javascript
vue-loader中引入模板预处理器的实现
2019/09/04 Javascript
JavaScript实现简单的弹窗效果
2020/05/19 Javascript
解决vue-pdf查看pdf文件及打印乱码的问题
2020/11/04 Javascript
python使用opencv按一定间隔截取视频帧
2018/03/06 Python
Python补齐字符串长度的实例
2018/11/15 Python
Python面向对象程序设计OOP入门教程【类,实例,继承,重载等】
2019/01/05 Python
numpy concatenate数组拼接方法示例介绍
2019/05/27 Python
对于Python深浅拷贝的理解
2019/07/29 Python
基于python进行抽样分布描述及实践详解
2019/09/02 Python
python生成requirements.txt的两种方法
2019/09/18 Python
Python函数的定义方式与函数参数问题实例分析
2019/12/26 Python
Python 利用flask搭建一个共享服务器的步骤
2020/12/05 Python
css3.0 图形构成实例练习二
2013/03/19 HTML / CSS
SkinCeuticals官网:美国药妆品牌
2018/04/19 全球购物
全球采购的街头服饰和帽子:Urban Excess
2020/10/28 全球购物
自动化专业毕业生自荐信
2013/11/01 职场文书
建筑班组长岗位职责
2014/01/02 职场文书
运动会获奖感言
2014/02/11 职场文书
小学安全教育材料
2014/02/17 职场文书
HTML页面滚动时部分内容位置固定不滚动的实现
2021/04/14 HTML / CSS
何时使用Map来代替普通的JS对象
2021/04/29 Javascript
解决Navicat for Mysql连接报错1251的问题(连接失败)
2021/05/27 MySQL
纯CSS3实现div按照顺序出入效果
2021/07/15 HTML / CSS
Python闭包的定义和使用方法
2022/04/11 Python