jQuery：运行css相关的方法AFTER之前的css方法完成

我正在通过jQuery执行以下操作，但它看起来像是几乎同时发生。jQuery：运行css相关的方法AFTER之前的css方法完成

有没有办法确保完成回调中的itemNameContainer.removeClass（'NoDisplay'）仅在loadContainer.addClass（'NoDisplay'）完成后才能运行？

在视觉上，它看起来像我看到“请稍候...”和项目名称的同时显示出来..

function onToggleItemCompletionStatus(currentItem) { 
    var itemId, toggle = !currentItem.Completed, 
     loadingContainer, itemNameContainer; 
    itemId = currentItem.ItemId; 
    loadingContainer = $('#loading_' + itemId); 
    itemNameContainer = $('#name_' + itemId); 

    $.ajax({ 
     beforeSend: function (xhr, settings) { 
      loadingContainer.removeClass('noDisplay'); 
      itemNameContainer.addClass('noDisplay'); 
     }, 
     complete: function (xhr, textStatus) { 
      loadingContainer.addClass('noDisplay'); 
      itemNameContainer.removeClass('noDisplay'); 
     }, 
     data: { 
      accessToken: aToken, 
      listId: currentGroceryList.Id, 
      itemId: currentItem.ItemId, 
      completed: toggle 
     }, 
     dateType: 'json', 
     error: function (xhr, textStatus, errorThrown) { 
      $.publish(customEvent.ItemToggledFail, [currentItem]); 
     }, 
     success: function (data, textStatus, xhr) { 
      var success = data.success; 

      if (success) { 
       $.publish(customEvent.ItemToggledSuccess, [currentItem]); 
      } else { 
       $.publish(customEvent.ItemToggledFail, [currentItem]); 
      } 
     }, 
     type: 'POST', 
     url: actionUrls.toggleItemCompletionStatus 
    }); 
}

编辑我粘贴的实际功能提供更好想法

来源

2011-01-28 Abe

没有什么是跳出来......是请求同步或异步？你可以发布$ .ajax调用的其余部分吗？响应是否很快到达？ – 2011-01-28 00:20:02

他们应该在微秒内执行，所以没有给出回调。我知道CSS应用*钩子后没有*。你可能会用`setTimeout（）`搞怪，但我经常不推荐它。 – alex 2011-01-28 00:20:28

不，我知道的，但你可以尝试......我

loadContainer.fadeOut(300, function() { 
    itemNameContainer.removeClass('NoDisplay'); 
});

来源

2011-01-28 00:21:28 alex

jQuery：运行css相关的方法AFTER之前的css方法完成

回答

相关问题