• 用jquery的ajax方法获取不到return返回值


    如果jquery中,获取不到ajax返回值。

    两个错误写法会导致这种情况:1.ajax未用同步  2.在ajax方法中直接return返回值。

    下面列举了三种写法,如果想成功获取到返回值,参考第三种写法:

     1 /**
     2  * 方式:(1)同步调用 (2)在ajax函数中return值
     3  * 结果:返回 1。未成功获取返回值
     4  * 失败原因:ajax内部是一个或多个定义的函数,ajax中return返回值,
     5  * 返回到ajax定义函数,而不是返回到ajax外层的函数checkAccount1()
     6  */
     7 function checkAccount1(){
     8     var result = 1;
     9     $.ajax({
    10         url : 'test.do',
    11         type : "post",
    12         data : {},
    13         async : false,
    14         success : function(data) {
    15             return 2;
    16         }
    17     });
    18     return result;
    19 }
    20 
    21 /**
    22  * (1)异步调用 (2)在ajax对全局变量进行设值 (3)ajax函数外将变量return
    23  * 结果:返回 1。未成功获取返回值
    24  * 失败原因:ajax请求和后面的return result语句异步执行,
    25  * 导致return result比result = 2先执行并返回result的值
    26  */
    27 function checkAccount2(){
    28     var result = 1;
    29     $.ajax({
    30         url : 'test.do',
    31         type : "post",
    32         data : {},
    33         async : true,
    34         success : function(data) {
    35             result = 2;
    36         }
    37     });
    38     return result;
    39 }
    40 
    41 /**
    42  * (1)同步调用 (2)且在ajax对全局变量进行设值 (3)ajax函数外将变量return
    43  * 结果:返回 2。成功获取返回值
    44  * 成功原因:先执行result = 2;再往下执行return result;
    45  */
    46 function checkAccount3(){
    47     var result = 1;
    48     $.ajax({
    49         url : 'test.do',
    50         type : "post",
    51         data : {},
    52         async : false,
    53         success : function(data) {
    54             result = 2;
    55         }
    56     });
    57     return result;
    58 }

    还有一种写法是用回调函数,最近写项目自己总结出来的。回调函数解决了同步体验不好的问题,当然在这个登录的例子不太适合用,时间原因,下次补充好的体验的例子。
    27 function checkAccount4(callBack){
    29     $.ajax({
    30         url : 'test.do',
    31         type : "post",
    32         data : {},
    33         async : true,
    34         success : function(data) {
              if(data== "success"){
                 callBack(0); 
              }else{
                callBack(1);
              }
              36 } 37 }); 39 }

    function checkAndLogin(){
      checkAccount4(loginAction);
    }

    function loginAction(result){
      if(result == 0){
        //跳转到登录页面
      }else{
        alert("登录失败,校验登录名和密码");
      }
    }

    因为正在赶项目,临时想到的解决办法,就在博客里补充了一下。所以最后一种写的比较粗糙,可能有错误的地方,后面有时间更正一下。
    
    
  • 相关阅读:
    跨域常见解决方案
    express-session的简单使用说明
    Spring Cloud中,如何解决Feign/Ribbon第一次请求失败的问题?
    继承父类的静态方法的加载顺序
    sql索引优化
    EXPLAIN 执行计划详解
    JVM总括二-垃圾回收:GC Roots、回收算法、回收器
    dubbo知识体系
    Spring bean的生命流程
    日志体系与异常处理
  • 原文地址:https://www.cnblogs.com/terryMe/p/6130309.html
Copyright © 2020-2023  润新知