Question

我试图在异步调用之后调用一个函数但在异步调用函数之后正常函数没有触发，我不确定是什么停止它请帮我弄明白。我正在尝试学习延迟的概念并承诺，不知道我错过了什么。 fiddle

$(document).ready(function(e) {
     var form_data = $(this).serialize();
        var form_url = $(this).attr("action");
        var form_method = $(this).attr("method").toUpperCase();

    $("form[ajax=true]").submit(function(e) {
         e.preventDefault();
        $("#loadingimg").show();
        var promise = ajaxcall_function();
        promise.then(somes1());



    });

});
function somes1(){
   alert("dd");
}
function ajaxcall_function(){
    var deferred = $.Deferred();
      $.ajax({
            url: form_url, 
            type: form_method,      
            data: form_data,     
            cache: false,
            success: function(returnhtml){                          
                $("#result").html(returnhtml); 
                $("#loadingimg").hide();       
                 deferred.resolve();
            }           
        });    
     return deferred.promise();
}

Answer 1

你需要使用它：

 promise.then(somes1);

而不是：

 promise.then(somes1());

你这样做的方法是立即调用函数并将返回结果传递给.then()。这显然不是你想要的。相反，您只想传递一个函数引用（只是没有括号的函数名），以便以后可以调用它。当您将()添加到函数名称的末尾时，这意味着立即调用它。

您还可以简化这样的ajax函数，以使用已从$.ajax()返回的承诺，而不是创建自己的承诺：

function ajaxcall_function(){
      return $.ajax({
            url: form_url, 
            type: form_method,      
            data: form_data,     
            cache: false
        }).then(function(returnhtml) {                          
              $("#result").html(returnhtml); 
              $("#loadingimg").hide();
              return returnhtml;
        });    

}

ajaxcall_function().then(function(data) {
    // code here
});

Answer 2

如果你需要一个包装器，你可以尝试这样：

function ajaxcall_function(form){
    var form_data = $(form).serialize();
    var form_url = $(form).attr("action");
    var form_method = $(form).attr("method").toUpperCase();

    var deferred = $.Deferred();
      $.ajax({
            url: form_url, 
            type: form_method,      
            data: form_data,     
            cache: false,
            success: function(returnhtml){                          
                $("#result").html(returnhtml); 
                $("#loadingimg").hide();       
                 deferred.resolve.apply(this, arguments);
            }           
        });
     // Make other things here    
     return deferred.promise();
}

 ajaxcall_function()
 .done(function(returnhtml){
     // do something here with returnhtml
     // note the 'this' - scope is different because of .apply(this, arguments)
 })

这是重构的小提琴。 http://jsfiddle.net/8a3mwkfp/4/

但是考虑到包装器必须有意义，否则你应该使用$.ajax返回结果作为promise。

承诺并且拒绝在jquery中工作

2 个答案: