javascript - 棘手的范围问题？

Question

非常简单，但它没有按应有的方式工作。

$(function(){   
  (function(){  
     /**
      * @return boolean Depending on success
      */
     function saveOnServer(data){            
         var result = false;            
         $.ajax({                 
             url : "/post/write.ajax",
             data : data, 
             success : function(response){                      
                  if (response == "1"){                           
                      alert('Response is 1. OK');                          
                      result = true;
                  }
             }
         });             
         return result;
     }                  

     $("#save").click(function(e){              
          e.preventDefault();               
          // This inserts some stuff (on the server), but always returns FALSE
          if ( saveOnServer($("form").serialize())) ){                  
              alert('1'); // This expected to be alerted              
          } else {                 
              alert('0'); // <- But... This will be alerted
          }
     });
  })($);
});

问题是responsevar 总是返回1，它Response is 1. OK也会发出警报。但...

result总是FALSE。为什么？

Answer 1

在此请求完成之前，您无法返回异步请求的结果。

您必须做的是在成功回调中使用结果：

 function saveOnServer(data, dowith){
     $.ajax({
         url : "/post/write.ajax",
         data : data, 
         success : function(response){
              doWith(response == "1")
         }, error : function() {
              doWith(false)
         }
     });
 }

 $("#save").click(function(e){
      e.preventDefault(); 
      // This inserts some stuff (on the server), but always returns FALSE
      saveOnServer($("form").serialize()), function(result){
         if (result) {
            alert('1'); // This expected to be alerted
         } else {
            alert('0'); // <- But... This will be alerted
         } 
      });
 });

Answer 2

if ( saveOnServer($("form").serialize())) ){

您正在测试函数 saveOnServer() 的返回结果。这会立即返回值false，它不会等待 ajax 调用完成。

Answer 3

像大多数 AJAX 问题一样，它似乎与 AJAX 异步有关，这意味着您希望函数返回一个值，但 ajax 请求并未随之返回。尝试添加 async:false 以确保这是问题所在。

$.ajax({                 
             url : "/post/write.ajax",
             data : data,
             async:false,
             success : function(response){                      
                  if (response == "1"){                           
                      alert('Response is 1. OK');                          
                      result = true;
                  }
             }
         });             

如果是这样，您应该考虑以一种在成功函数内部实现功能的方式重做您的代码。