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 相关文章推荐
filters.revealTrans.Transition使用方法小结
Aug 19 Javascript
JavaScript 原型继承
Dec 26 Javascript
页面使用密码保护代码
Apr 10 Javascript
javascript中attribute和property的区别详解
Jun 05 Javascript
JavaScript学习笔记之定时器
Jan 22 Javascript
js面向对象之公有、私有、静态属性和方法详解
Apr 17 Javascript
微信小程序canvas写字板效果及实例
Jun 15 Javascript
vue解决弹出蒙层滑动穿透问题的方法
Sep 22 Javascript
Postman参数化实现过程及原理解析
Aug 13 Javascript
swiper4实现移动端导航栏tab滑动切换
Oct 16 Javascript
原生js实现弹窗消息动画
Nov 20 Javascript
JavaScript 语句之常用 for 循环详解
Mar 29 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中如何定义和使用常量
2013/02/28 PHP
使用PHP Socket 编程模拟Http post和get请求
2014/11/25 PHP
ThinkPHP实现递归无级分类――代码少
2015/07/29 PHP
PHP基于PDO调用sqlserver存储过程通用方法【基于Yii框架】
2017/10/07 PHP
使用XHProf查找PHP性能瓶颈的实例
2017/12/13 PHP
PHP实现生成模糊图片的方法示例
2017/12/21 PHP
Js 时间间隔计算的函数(间隔天数)
2011/11/15 Javascript
JS刷新框架外页面七种实现代码
2013/02/18 Javascript
javascript中字体浮动效果的简单实例演示
2015/11/18 Javascript
javascript定义类和类的实现实例详解
2015/12/01 Javascript
极易被忽视的javascript面试题七问七答
2016/02/15 Javascript
利用Javascript仿Excel的数据透视分析功能
2016/09/07 Javascript
Node.js中如何合并两个复杂对象详解
2016/12/31 Javascript
利用原生JS与jQuery实现数字线性变化的动画
2017/02/24 Javascript
Vue父子模版传值及组件传值的三种方法
2017/11/27 Javascript
nodeJS服务器的创建和重新启动的实现方法
2018/05/12 NodeJs
Angular通过指令动态添加组件问题
2018/07/09 Javascript
微信小程序中遇到的iOS兼容性问题小结
2018/11/14 Javascript
layui时间控件选择时间范围的实现方法
2019/09/28 Javascript
js正则匹配多个全部数据问题
2019/12/20 Javascript
NodeJS开发人员常见五个错误理解
2020/10/14 NodeJs
jQuery实现简单评论区功能
2020/10/26 jQuery
详解基于element的区间选择组件校验(交易金额)
2021/01/07 Javascript
Python双精度浮点数运算并分行显示操作示例
2017/07/21 Python
python 类对象和实例对象动态添加方法(分享)
2017/12/31 Python
Python编程实现线性回归和批量梯度下降法代码实例
2018/01/04 Python
python3的输入方式及多组输入方法
2018/10/17 Python
django数据模型(Model)的字段类型解析
2019/12/25 Python
Python 实现将numpy中的nan和inf,nan替换成对应的均值
2020/06/08 Python
Python实现删除某列中含有空值的行的示例代码
2020/07/20 Python
Python 数据分析之逐块读取文本的实现
2020/12/14 Python
HTML5 Canvas 起步(1) - 基本概念
2009/05/12 HTML / CSS
照片礼物和装饰:MyPhoto
2019/11/02 全球购物
会议室标语
2014/06/21 职场文书
2014领导班子四风问题查摆思想汇报
2014/09/13 职场文书
小学生优秀作文范文(六篇)
2019/07/10 职场文书