jQuery Ajax 在页面刷新之前响应只工作一次

Question

这是使用 jQuery Ajax 提交的简单订阅者表单，一切正常，但警报响应仅显示一次，直到页面刷新。

这是我的视图代码：

$(document).ready(function () {
  $("#ssubmit").click(function (e) {
    e.preventDefault();
  
    let subscriber = $("#subscriber").val()
    subscriberdata = {subscriber: subscriber,}
  
    $.ajax({
      type: "POST",
      url: "form-process.php",
      data: JSON.stringify(subscriberdata),
      success: function (response) {
        subscribersucess = "<div class='alert alert-success text-center mt-3'>" + response + "</div>";
        $("#alerts").html(subscribersucess);
  
        setTimeout(function(){
          $('#alerts').fadeOut("slow");
        },5000)
  
        $("#subscriberform")[0].reset();
      }
    });
  
  })
});

我该如何解决这个问题？

Answer 1

发生这种情况是因为您正在使用淡出 function。一旦淡出发生，显示就会变为无。 它只会在您刷新页面时起作用。

您可以使用以下代码

let subscriber = $("#subscriber").val()

subscriberdata = {subscriber: subscriber,}

$.ajax({
  type: "POST",
  url: "form-process.php",
  data: JSON.stringify(subscriberdata),
  success: function (response) {

    subscribersucess = "<div class='alert alert-success text-center mt-3'>" + response + "</div>";
    $('#alerts').show().html();
                $("#alerts").html(subscribersucess);    
                    $('#alerts').delay(5000).fadeOut(); 
    


    $("#subscriberform")[0].reset();

  }

});