jQuery淡入淡出效果和Ajax登录

我正在使用以下代码通过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;
  });

我的问题是,因为我的请求处理得如此之快,所以淡入淡出效果彼此重叠,即使请求返回了一些要显示的数据,我也只是停留在“加载”状态.我做错了吗？

我不能使用jQuery的ajaxStart和ajaxStart,因为我在网站上使用了其他ajax表单,并且不希望它们触发“加载”

谢谢你的时间

最佳答案

尝试这个：

  //Capture the login_ajax form
  $("#login_ajax").submit(function () {
    //First we fade out the header-login div
    $("#header-login").fadeOut('fast',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.

原文地址：https://www.jb51.cc/jquery/530989.html