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判断客户端是iOS还是Android等移动终端的方法
Dec 11 Javascript
7个JS基础知识总结
Mar 05 Javascript
基于AngularJS实现页面滚动到底自动加载数据的功能
Oct 16 Javascript
分享使用AngularJS创建应用的5个框架
Dec 05 Javascript
详解handlebars+require基本使用方法
Dec 21 Javascript
jQuery基于ajax方式实现用户名存在性检查功能示例
Feb 10 Javascript
JS使用插件cryptojs进行加密解密数据实例
May 11 Javascript
深入浅析JavaScript中的RegExp对象
Sep 18 Javascript
jQuery幻灯片插件owlcarousel参数说明中文文档
Feb 27 jQuery
解决vue动态为数据添加新属性遇到的问题
Sep 18 Javascript
弱类型语言javascript开发中的一些坑实例小结【变量、函数、数组、对象、作用域等】
Aug 07 Javascript
详解vue身份认证管理和租户管理
May 25 Vue.js
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合并数组array_merge函数运算符加号与的区别
2008/10/31 PHP
深入PHP操作MongoDB的技术总结
2013/06/02 PHP
360通用php防护代码(使用操作详解)
2013/06/18 PHP
PHP开发中常见的安全问题详解和解决方法(如Sql注入、CSRF、Xss、CC等)
2014/04/21 PHP
编写PHP脚本使WordPress的主题支持Widget侧边栏
2015/12/14 PHP
PHP基于mssql扩展远程连接MSSQL的简单实现方法
2016/10/08 PHP
jQuery使用手册之一
2007/03/24 Javascript
Javascript valueOf 使用方法
2008/12/28 Javascript
jQuery 性能优化指南(3)
2009/05/21 Javascript
JQUERY dialog的用法详细解析
2013/12/19 Javascript
jQuery可见性过滤器:hidden和:visibility用法实例
2015/06/24 Javascript
解决OneThink中无法异步提交kindeditor文本框中修改后的内容方法
2017/05/05 Javascript
微信小程序实现图片上传功能实例(前端+PHP后端)
2018/01/10 Javascript
实现jquery放大镜的两种方法
2018/02/22 jQuery
vue 子组件向父组件传值方法
2018/02/26 Javascript
vue监听input标签的value值方法
2018/08/27 Javascript
JavaScript 自定义html元素鼠标右键菜单功能
2019/12/02 Javascript
vue中音频wavesurfer.js的使用方法
2020/02/20 Vue.js
[06:48]DOTA2-DPC中国联赛2月26日Recap集锦
2021/03/11 DOTA
有关wxpython pyqt内存占用问题分析
2014/06/09 Python
举例讲解Python中的死锁、可重入锁和互斥锁
2015/11/05 Python
python实现单链表中删除倒数第K个节点的方法
2018/09/28 Python
Python使用sax模块解析XML文件示例
2019/04/04 Python
python实时检测键盘输入函数的示例
2019/07/17 Python
Python中利用LSTM模型进行时间序列预测分析的实现
2019/07/26 Python
python matplotlib拟合直线的实现
2019/11/19 Python
Python实现自动访问网页的例子
2020/02/21 Python
Python filter()及reduce()函数使用方法解析
2020/09/05 Python
HTML5 中新的全局属性(整理)
2013/07/31 HTML / CSS
Gap中国官网:美式休闲风服饰
2017/02/05 全球购物
英国女士家居服网站:hush
2017/08/09 全球购物
工作会议主持词
2014/03/17 职场文书
党员承诺书格式范文
2015/04/28 职场文书
MySQL 常见的数据表设计误区汇总
2021/06/07 MySQL
python自动化测试通过日志3分钟定位bug
2021/11/20 Python
漫画「狩龙人拉格纳」公开TV动画预告图
2022/03/22 日漫