简单的 fadeOut() 作为 ajax 回调工作不正常答案

【问题标题】：Simple fadeOut() working erratically as ajax callback简单的 fadeOut() 作为 ajax 回调工作不正常
【发布时间】：2014-06-27 11:01:33
【问题描述】：

这让我发疯了！

我不明白为什么fadeOut() 函数在这里不起作用。我敢肯定这将是一件令人讨厌的简单事情，但我就是看不到它。单击触发按钮时，第一个 fadeOut() 工作正常 - #page3 按预期淡出，#holdingpage 淡入。但是，一旦 ajax 调用完成，#holdingPage div 不会淡出，但 @ 987654326@ div 确实淡入，所以我留下了 #holdingPage div 和 #thanksPage div 的内容。 ajax 调用本身工作正常 - 表单已提交，数据通过 php 脚本写入数据库。

谁能帮忙？！

代码如下：

HTML

<div id="page3" class="surveyDivs">
...blah...blah...blah...
</div>

<div id="holdingPage" class="surveyDivs" style="display: none;">
  <div class="loadingDiv">
    <img class="loadingImage" src="../css/ajax-loader.gif" />
  </div>
</div>

<div id="thanksPage" class="surveyDivs" style="display: none;">
...blah...blah...blah...
</div>

jQuery

docu.on('click', "#finishSurveyButton", function(){
  $('#page3').fadeOut(function(){
  $('#holdingPage').fadeIn();
  });
  $("#inductSurvForm").ajaxForm({
    success: function(data){
      $('#holdingPage').fadeOut(function(){
        $('#thanksPage').fadeIn();  
      });

      }
    }).submit();    
  });

【问题讨论】：

这是什么文档？在jQuery中
只是 $(document) 包装在一个变量中
你能提供一个jsfiddle
尝试在 $('#page3').fadeOut(); 的动画完成中完全编写 ajax 函数；我猜这里的顺序是混乱的，因为一旦页面淡入淡出就必须调用 ajax，并且可能是 ajax 调用发生的速度比淡入淡出更快
docu.on('click', "#finishSurveyButton", function(){ $('#page3').fadeOut(function(){ $('#holdingPage').fadeIn() ; $("#inductSurvForm").ajaxForm({ 成功: function(data){ $('#holdingPage').fadeOut(function(){ $('#thanksPage').fadeIn(); }); } } ).submit(); }); });

标签： jquery ajax ajaxform

【解决方案1】：

尝试在 $('#page3').fadeOut(); 的动画完成中完全编写 ajax 函数我猜这里的顺序会变得混乱，因为一旦页面淡入淡出就必须调用 ajax，并且可能是 ajax 调用发生得比淡入淡出更快

docu.on('click', "#finishSurveyButton", function(){
  $('#page3').fadeOut(function(){
  $('#holdingPage').fadeIn();
  });
  $("#inductSurvForm").ajaxForm({
    success: function(data){
      $('#holdingPage').fadeOut(function(){
        $('#thanksPage').fadeIn();  
      });

      }
    }).submit();    
  });

【讨论】：