Question

我正在使用Liveform服务通过网络发送电子邮件。现在，每次您提交时，它都会发出失败或成功的消息。

虽然显示失败消息有效，但显示成功消息却不成功-因为我在有机会出现之前进行了重定向。所以我需要以某种方式延迟它。

这是我的代码：

$output = array();
foreach ($toto as $data)
{
    $output[] = $data["name"];
}
print_r($output);

$(document).ready(function() {
  $('#emailError').removeClass('active');
  $('#contact-form').submit(function(e) {
    var email = $('#email').val();
    console.log(email);
    var message = $('#message').val();
    console.log(message);

    if (!email || !message) {
      alertify.error('Please enter an email and a message');
      e.preventDefault();
      return;
    }
    // REDIRECT IN THIS POINT- > HOW TO DELAY HERE?
    setTimeout(function() {
      alertify.success('SENT SUCCESSFULLY!');
    }, 3000);
  });
});

如何使服务器等待几秒钟直到警报出现？如您所见，我没有使用超时功能。

谢谢

Answer 1

请注意，您实际上并没有在进行提交，而是只是在发现表单已提交。如果您希望在该提交上拥有真实的成功/失败状态，那么您可能希望劫持表单提交过程，并用自己的表单代替。

This is taken from a related question，但适合您的使用。

$("#myform").submit(function(event) {
  // Hijack the form submit. We want to control this ourselves.
  event.preventDefault();

  // get the form field values
  var email = $('#email').val(),
      message = $('#message').val();

  // Do we have both an email and message? If not, alert and stop.
  if(!email.length>0 && !message.length>0){ 
    alertify.error("Please enter an email and message.");
    return false;
  }

  // I like to use defers :)
  // submit our post data, and include the form values as the POST body
  deferred = $.post("http://somewhere.com", { email: email, message: message });

  // Having hijacked the POST process, we have the success callbacks
  deferred.success(function () {
    alertify.success('SENT SUCCESSFULLY!');
  });

  // also, if the POST failed, we can notify the user of that.
  deferred.error(function () {
    // Handle any errors here.
  });
});

在此处详细了解jQuery.post()。此外，关于延期或承诺的更多信息。 Javascript从jQuery的运行方式中吸取了一些教训，并添加了一种设置动作的方法，该动作可能会花费不确定的时间（通常是与服务器对话）。

Javascript给了我们一个承诺，就像在餐馆里下订单。您放下纸条，然后等待听到“点菜！！”。到那时，当您准备好饭菜时，女服务员将为您带来食物。如果订单出现严重错误（例如，在培根上大量运行），则订单仍会完成，但是会出现错误，此时女服务员会来告诉您。

$。post（...）使用Promises。因此，我们可以为完成的Promise添加.success（...）处理程序，为Promise失败时添加.error（...）处理程序。

我真的建议您阅读Promises上的MDN文档，尤其是fetch（...）。

通过表单提交重定向进行延迟

1 个答案: