jquery ajax return没有返回值的解决方法


Posted in Javascript onOctober 20, 2011

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

function getReturnAjax{ 
$.ajax({ 
type:"POST", 
url:"ajax/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", 
url:"ajax/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, 
url:"ajax/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", 
url:"ajax/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); 
}

按需选择自己需要的方案吧。一般大网站都采用第2种传入函数的方式,来处理成功和失败情况下的页面提示。
//添加async:false.即修改为同步 
//等ajax给bol赋值完毕后,才执行下面的js部分。而异步的话,还没有来得及赋值,就已经return了。 
function vcodeYes() { 
var bol = false; 
$.ajax( 
{ 
type: "GET", 
url: "../Ajax/ValidationCode.ashx", 
data: { txtVcode: $('#<%=txtVcode.ClientID%>').val() }, 
async: false, 
success: function (data) { 
if (data == "0") { 
$.dialog({ icon: 'warning', follow: document.getElementById('txtVcode'), content: '验证码错误!' }).time(1); 
changeCaptchaImage('imgVerify2', 'txtVcode'); 
} 
else { 
bol = true; 
} 
} 
}); 
return bol; 
} 
//验证没通过是 返回false 否则执行下面函数 
$('.getVodes').click(function () { 
if (vcodeYes()) { 
。。。执行下面。。。 
} 
});
Javascript 相关文章推荐
js判断生效时间不得大于失效时间的思路及代码
Apr 23 Javascript
通过JQuery实现win8一样酷炫的动态磁贴效果(示例代码)
Jul 13 Javascript
javascript 动态创建表格的2种方法总结
Mar 04 Javascript
JavaScript知识点总结之如何提高性能
Jan 15 Javascript
JavaScript实现设计模式中的单例模式的一些技巧总结
May 17 Javascript
简单实现JS计算器功能
Dec 21 Javascript
对vue里函数的调用顺序介绍
Mar 17 Javascript
vue.js实现的经典计算器/科学计算器功能示例
Jul 11 Javascript
vue中导出Excel表格的实现代码
Oct 18 Javascript
了解JavaScript函数中的默认参数
May 30 Javascript
Vue使用mixin分发组件的可复用功能
Sep 01 Javascript
JavaScript canvas绘制圆弧与圆形
Feb 18 Javascript
IE与FireFox中的childNodes区别
Oct 20 #Javascript
IE和Firefox的Javascript兼容性总结[推荐收藏]
Oct 19 #Javascript
基于jquery的$.ajax async使用
Oct 19 #Javascript
jQuery EasyUI API 中文文档 - Calendar日历使用
Oct 19 #Javascript
模拟select的代码
Oct 19 #Javascript
通过下拉框的值来确定输入框是否可以为空的代码
Oct 18 #Javascript
Notify - 基于jquery的消息通知插件
Oct 18 #Javascript
You might like
一首老MP3,致敬WAR3经典
2021/03/08 魔兽争霸
快速开发一个PHP扩展图文教程
2008/12/12 PHP
php中XMLHttpRequest(Ajax)不能设置自定义的Referer的解决方法
2011/11/26 PHP
PHP7导出Excel报ERR_EMPTY_RESPONSE解决方法
2019/04/16 PHP
学习ExtJS Column布局
2009/10/08 Javascript
javascript自定义函数参数传递为字符串格式
2014/07/29 Javascript
Javascript实现单张图片浏览
2014/12/18 Javascript
jquery图片播放浏览插件prettyPhoto使用详解
2014/12/19 Javascript
JS实现从网页顶部掉下弹出层效果的方法
2015/08/06 Javascript
说说如何在Vue.js中实现数字输入组件的方法
2019/01/08 Javascript
详解小程序退出页面时清除定时器
2019/04/28 Javascript
Bootstrap 时间日历插件bootstrap-datetimepicker配置与应用小结
2019/05/28 Javascript
基于js实现判断浏览器类型代码实例
2020/07/17 Javascript
python基于隐马尔可夫模型实现中文拼音输入
2016/04/01 Python
Python 实现域名解析为ip的方法
2019/02/14 Python
浅谈python常用程序算法
2019/03/22 Python
python画微信表情符的实例代码
2019/10/09 Python
利用 Python ElementTree 生成 xml的实例
2020/03/06 Python
python实现简单俄罗斯方块
2020/03/13 Python
图解Python中深浅copy(通俗易懂)
2020/09/03 Python
css3个性化字体_动力节点Java学院整理
2017/07/12 HTML / CSS
html5 button autofocus 属性介绍及应用
2013/01/04 HTML / CSS
StubHub巴西:购买和出售您的门票
2016/07/22 全球购物
Alba Moda德国网上商店:意大利时尚女装销售
2016/11/14 全球购物
比利时香水网上商店:NOTINO
2018/03/28 全球购物
美国波西米亚风格精品店:South Moon Under
2019/10/26 全球购物
香港百佳网上超级市场:PARKNSHOP.com
2020/06/10 全球购物
劳动之星获奖感言
2014/02/01 职场文书
致共产党员倡议书
2014/04/16 职场文书
团结就是力量演讲稿
2014/05/21 职场文书
部门活动策划方案
2014/08/16 职场文书
大学生党员自我批评思想汇报
2014/10/10 职场文书
关于党风廉政建设宣传教育月的活动总结!
2019/08/08 职场文书
什么是求职信?求职信应包含哪些内容?
2019/08/14 职场文书
MySQL Router实现MySQL的读写分离的方法
2021/05/27 MySQL
上个世纪50年代的可穿戴技术:无线电帽子
2022/02/18 无线电