jQuery淡入淡出效果和Ajax登錄

Question

我正在使用以下一段代碼通過Ajax登錄用戶。

//Capture the login_ajax form 
    $("#login_ajax").submit(function() { 
    //First we fade out the header-login div 
    $("#header-login").fadeOut('fast', function() { 
     $(this).html("Loading").fadeIn('fast'); //Fade in loaading 
    }); 
    $.post("db/login.php", 
      { username: $("#username").val(), password: $("#password").val() }, 
      function(data) { 
      $("#header-login").fadeOut('fast', function() { //Fade out loading 
       $(this).html(data).fadeIn('fast'); //Fade in data 
      }); 
      }); 
    return false; 
    }); 

我的問題是，因爲我的要求正在處理如此之快，褪色效果重疊海誓山盟，我只是堅持了「加載」，即使請求返回要顯示的一些數據。我做錯了嗎？

，因爲我用我的網站上其他Ajax形式，不希望他們觸發「加載」

感謝您的時間

Answer 1

試試這個我不能使用jQuery的ajaxStart和ajaxStart：

//Capture the login_ajax form 
    $("#login_ajax").submit(function() { 
    //First we fade out the header-login div 
    $("#header-login").fadeOut('fast', function() { 
     $(this).html("Loading").fadeIn('fast'); //Fade in loaading 
    }); 
    $.post("db/login.php", 
      { username: $("#username").val(), password: $("#password").val() }, 
      function(data) { 
      $("#header-login").stop().fadeOut('fast', function() { //Fade out loading 
       $(this).html(data).fadeIn('fast'); //Fade in data 
      }); 
      }); 
    return false; 
    }); 

當你調用.stop()，回調不會被觸發，這將防止.html("Loading")從後開槍。 See here for a full read。

Answer 2

您可以嘗試在第一個fadeIn方法（代碼示例的第5行）的回調中發佈表單。如果我沒有弄錯，那應該保證這些動畫效果更優雅的鏈接。