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();

  }

});