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 相关文章推荐
用函数式编程技术编写优美的 JavaScript
Nov 25 Javascript
JS 判断undefined的实现代码
Nov 26 Javascript
JS二维数组的定义说明
Mar 03 Javascript
用unescape反编码得出汉字示例
Apr 24 Javascript
js统计录入文本框中字符的个数并加以限制不超过多少
May 23 Javascript
jQuery将多条数据插入模态框的示例代码
Sep 25 Javascript
JavaScript实现自动消除按钮功能的方法
Aug 05 Javascript
瀑布流的实现方式(原生js+jquery+css3)
Jun 28 Javascript
JS中如何比较两个Json对象是否相等实例代码
Jul 13 Javascript
CSS3 media queries结合jQuery实现响应式导航
Sep 30 Javascript
JS非行间样式获取函数的实例代码
Jun 05 Javascript
Angular5.0 子组件通过service传递值给父组件的方法
Jul 13 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
用PHP发电子邮件
2006/10/09 PHP
基于PHP开发中的安全防范知识详解
2013/06/06 PHP
PHP中使用memcache存储session的三种配置方法
2014/04/05 PHP
浅谈COOKIE和SESSION区别
2015/07/19 PHP
PHP读书笔记整理_结构语句详解
2016/07/01 PHP
Laravel框架实现的上传图片到七牛功能详解
2019/09/06 PHP
javascript 嵌套的函数(作用域链)
2010/03/15 Javascript
img onload事件绑定各浏览器均可执行
2012/12/19 Javascript
JavaScript数据类型之基本类型和引用类型的值
2015/04/01 Javascript
详解AngularJS中的依赖注入机制
2015/06/17 Javascript
jQuery实现拖拽可编辑模块功能代码
2017/01/12 Javascript
JS查找字符串中出现最多的字符及个数统计
2017/02/04 Javascript
Bootstrap模态框使用详解
2017/02/15 Javascript
JS实现移动端按首字母检索城市列表附源码下载
2017/07/05 Javascript
jQuery实现的简单前端搜索功能示例
2017/10/28 jQuery
vue页面跳转后返回原页面初始位置方法
2018/02/11 Javascript
js里面的变量范围分享
2020/07/18 Javascript
[09:34]2018DOTA2国际邀请赛寻真——永不放弃的iG
2018/08/14 DOTA
Python转码问题的解决方法
2008/10/07 Python
python实现socket端口重定向示例
2014/02/10 Python
python使用matplotlib画饼状图
2018/09/25 Python
pandas将多个dataframe以多个sheet的形式保存到一个excel文件中
2019/10/10 Python
python调用HEG工具批量处理MODIS数据的方法及注意事项
2020/02/18 Python
CSS3动画效果回调处理详解
2014/12/10 HTML / CSS
Foreo国际站:Foreo International
2018/10/29 全球购物
一道写SQL的面试题和答案
2013/11/19 面试题
Ejb技术面试题
2015/04/29 面试题
父亲八十大寿答谢词
2014/01/23 职场文书
大专生毕业的自我评价
2014/02/06 职场文书
资助贫困学生倡议书
2014/05/16 职场文书
优秀本科毕业生自荐信
2014/07/04 职场文书
婚礼父母答谢词
2015/01/04 职场文书
演讲稿之感恩老师(三篇范文)
2019/09/06 职场文书
创业计划书之美容店
2019/09/16 职场文书
浅谈golang package中init方法的多处定义及运行顺序问题
2021/05/06 Golang
Python序列化与反序列化相关知识总结
2021/06/08 Python