在收到 ajax 响应之前显示消息答案

【问题标题】：Show message until ajax response is received在收到 ajax 响应之前显示消息
【发布时间】：2014-10-29 09:37:05
【问题描述】：

我想在 ajax 响应到来之前显示一条错误消息。已尝试使用以下代码：

$.ajax({
      url: "user.php",
      type: 'POST',
      data: $('#forgot-form').serialize(),
      beforeSend: function(){
         $('#error').html("Please wait until your request is processed.");
         setTimeout(function() { $("#error").html(''); }, 8000);
       }
     } ).done (function(data) { 
          /* I tried with the commented code also. But this section didn't worked */
          //$('#error').html("Please wait until your request is processed.");
          // setTimeout(function() { $("#error").html('Please wait until your request is processed.'); }, 8000);
          if (data == "success") {  
              $('#user-login').val('');
              $('#error').html("Please check your email to reset your password");
              setTimeout(function() { $("#error").html(''); }, 5000);   
              }  else if (data == "invalid") {

                         $('#error').html("Username or email doesnot exist");
                         setTimeout(function() { $("#error").html(''); }, 5000);
                         $('#user-login').focus();
                         return false;
                 }
         });

在 user.php 页面中，如果用户详细信息正确，我将向用户发送电子邮件。所以反应来得晚。到那时我想显示等待消息。

此代码正确显示等待消息。但在那之后有一个小的延迟，然后只显示成功消息。我需要避免这个时间延迟。如何更改代码以避免延迟？

谁能帮我做这件事？提前致谢。

【问题讨论】：

标签： php jquery ajax delay settimeout

【解决方案1】：

试试这个：

只需从发送前的回调中删除setTimeout()。它将在#error 中显示消息，并在ajax 完成后替换消息。

 $.ajax({
          url: "user.php",
          type: 'POST',
          data: $('#forgot-form').serialize(),
          beforeSend: function(){
             $('#error').html("Please wait until your request is processed.");

           }
         } ).done (function(data) { 
              /* I tried with the commented code also. But this section didn't worked */
              //$('#error').html("Please wait until your request is processed.");
              // setTimeout(function() { $("#error").html('Please wait until your request is processed.'); }, 8000);
              if (data == "success") {  
                  $('#user-login').val('');
                  $('#error').html("Please check your email to reset your password");
                  setTimeout(function() { $("#error").html(''); }, 5000);   
                  }  
                  else if (data == "invalid") {

                             $('#error').html("Username or email doesnot exist");
                             setTimeout(function() { $("#error").html(''); }, 5000);
                             $('#user-login').focus();
                             return false;
                 }
      });

【讨论】：

【解决方案2】：

删除您的beforeSend() 并在$.ajax 呼叫之前设置等待消息。

 $('#error').html("Please wait until your request is processed.");
 $.ajax({
    url: "user.php",
    type: 'POST',
    data: $('#forgot-form').serialize(),
 }).done (function(data) { 
    if (data == "success") {  
      $('#user-login').val('');
      $('#error').html("Please check your email to reset your password");
      setTimeout(function() { $("#error").html(''); }, 5000);   
    }  else if (data == "invalid") {
      $('#error').html("Username or email doesnot exist");
      setTimeout(function() { $("#error").html(''); }, 5000);
      $('#user-login').focus();
      return false;
    }
  });

【讨论】：