Question

我有一个jquery函数，用于发送带有ajax请求的电子邮件;

function sendMail(from,to,subject,message){
    var datastr="from="+from+"&to="+to+"&subject="+subject+"&message="+message;
    $.ajax({
        type: "POST",
        url: "mail.php",
        data: datastr,
        cache: false,
        success: function(html){
            return true;
        },
        error: function(jqXHR,status,error){
            return false;
        }
    });
}

现在我想告诉用户邮件是否成功发送或不是这样的：

$("#feedback").html("Sending email...");
if(sendMail("from@email.com","to@email.com","MySubject","MyMessage"))
   $("#feedback").html("Email sent.");
else
   $("#feedback").html("Error sending email.");

但当然jQuery在发送邮件之前处理if条件，因此条件为false :-( 我怎么告诉jQuery要等到sendMail完成并返回一些东西？

Answer 1

虽然给定的答案是有效的，但我会考虑将sendmail函数和DOM修改分开（即将$("#feedback").html...保留在success/error回调之外）。您可以通过返回ajax调用的结果来执行此操作：

function sendMail(from,to,subject,message){
    var datastr="from="+from+"&to="+to+"&subject="+subject+"&message="+message;
    return $.ajax({
        type: "POST",
        url: "mail.php",
        data: datastr,
        cache: false
    });
}

返回值implements the Promise interface，这样您就可以执行此操作：

$("#feedback").html("Sending email...");
sendMail("from@email.com","to@email.com","MySubject","MyMessage")
    .done(function(){
        $("#feedback").html("Email sent.");
    })
    .fail(function(){
        $("#feedback").html("Error sending email.");
    });

请注意，我删除了ajax调用中的success和error字段，因为它们不需要，但如果您需要其它内容，您仍然可以使用它们，例如日志记录。

Answer 2

$("#feedback").html("Sending email...");
$.ajax({
    type: "POST",
    url: "mail.php",
    data: datastr,
    cache: false,
    success: function(html){
       if (sendMail("from@email.com","to@email.com","MySubject","MyMessage")) {
          $("#feedback").html("Email sent.");
       } else {
          $("#feedback").html("Error sending email.");
       }
    },
    error: function(jqXHR,status,error){
        $("#feedback").html("Error sending email.");
    }
});

不知道sendMail是什么，但是如果你检查电子邮件是否已发送，那么就这样吧？

Answer 3

您的sendMail函数无法根据AJAX调用的结果返回true / false（除非您使用同步请求，这几乎总是一个糟糕的主意）。这就是浏览器中JavaScript的工作方式，并且有充分的理由我不会进入这里。

相反，你必须告诉$.ajax即使成功或失败也要做什么。

这样做的一种方法如下：

$.ajax({
  // omitting arguments for clarity
  success: function(){
    $("#feedback").html("Email sent.");
  },
  error: function(){
    $("#feedback").html("Error sending email.");
  }
});

jQuery - 等待函数返回值

3 个答案: