Question

我试图在我的函数＆＃34; aggregateTimes＆＃34;之后执行一个函数。完成了。

这是我想在运行函数之前完成的aggregateTime函数：

function aggregateTimes(date) {      
    $.ajax(
      {
        url: 'localhost/s',
        dataType : 'xml',
        success: function(data) { 
          $.each(data, function(index, calEvent){ 
          //do some work here            
        });              
      },
      error: function(){
        alert('error message');
      }
   });        
}

这就是我现在调用函数的方式：

$('#mainpage').bind('pageinit', function(event) {    
  aggregateTimes(new Date()); 
  $("#calendar").jqmCalendar(
    {
      events : eventsArray,
      months : ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"],
      days : ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"],
      startOfWeek : 0
    });
});

有没有办法等待功能＆＃34; aggregateTimes＆＃34;在JQM之前完成？还是新手，谢谢！

Answer 1

由于您正在使用jQuery ajax，因此在ajax完成后使用complete方法执行一个函数。

function aggregateTimes(date){          

  $.ajax({
    url: 'localhost/s',
    dataType : 'xml',
    success: function(data){},
    error: function(){
      alert('error message');
    },
    complete: function(){
      myCustomFN();
      //do all your stuff here when the ajax is completed
    }
  });

}

Answer 2

您的aggregateTimes函数会发送一个AJAX请求，因此技术上会在该请求收到服务器的响应之前完成。如果您希望在请求收到响应后运行代码，您可以将代码移动到success已定义的aggregateTimes处理函数的末尾，或者您可以执行以下操作：

function aggregateTimes(date){          
    return $.ajax({
        url: 'localhost/s',
        dataType : 'xml',
        success: function(data){ 
            $.each(data, function(index, calEvent){ 
                //do some work here            
            });              
        },
        error: function(){
            alert('error message');
        }
    });
}

$('#mainpage').bind('pageinit', function (event) {
    var jqXhr = aggregateTimes(new Date());
    jqXhr.done(function () {
        $("#calendar").jqmCalendar({
            events: eventsArray,
            months: ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"],
            days: ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"],
            startOfWeek: 0
        });
    });
});

Answer 3

jQuery ajax函数用作Promise。所以，如果你回来了 jQuery ajax对象，你可以使用when...done方法调用另一个函数。

看起来像这样：

$.when( functionThatReturnsPromise() ).done(function () }
  // do stuff when the promise is complete
});

如果您在aggregateTimes中返回ajax对象，它将填充＆＃34; functionThatReturnsPromise＆＃34;在上面的例子中：

function aggregateTimes(date){          
    return $.ajax({
    ....

返回ajax对象也可以简单地将函数调用视为Deferred object：

aggregateTimes(new Date()).done(function () {
  // do stuff when aggregateTimes is done
});

文档

jQuery.promise - https://api.jquery.com/promise/
jQuery.when - https://api.jquery.com/jQuery.when/
jQuery.ajax - https://api.jquery.com/jQuery.ajax/
deferred.done - https://api.jquery.com/deferred.done/
jQuery延迟对象 - https://api.jquery.com/category/deferred-object/

Answer 4

你有几个选择。一种方法是使用回调。向aggregateTimes()添加一个附加参数，指定完成时调用的函数。如果那是你的话，它可以是一个匿名函数。

function aggregateTimes(date, callback){          

    $.ajax({
        url: 'localhost/s',
        dataType : 'xml',
        success: function(data){ 

             $.each(data, function(index, calEvent){ 
                 //do some work here            
             });
             callback();
         },
         error: function(){
             alert('error message');
         }
    });
}

// ...

aggregateTimes(new Date(), function() { 
    $("#calendar").jqmCalendar({
        events : eventsArray,
        months : ["January", "February", "March", "April", "May", "June",             "July", "August", "September", "October", "November", "December"],
        days : ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"],
        startOfWeek : 0
     });
});

另一种选择，因为你使用的是jQuery，就是使用$.Deferred。让aggregateTimes()返回Deferred对象：

function aggregateTimes() {
    var deferred = new $.Deferred();

    //...

        success: function(data){ 

             $.each(data, function(index, calEvent){ 
                 //do some work here            
             });
             deferred.resolve();
         },

    //...

    return deferred;
}

然后在$.Deferred完成时调用第二个函数。

var wait = aggregateTimes();

wait.done(function() {
    $("#calendar").jqmCalendar({
        events : eventsArray,
        months : ["January", "February", "March", "April", "May", "June",             "July", "August", "September", "October", "November", "December"],
        days : ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"],
        startOfWeek : 0
     });
});

jQuery Mobile在另一个完成后执行一个函数

4 个答案: