這裏當點擊按鈕時，ajax請求會被調用。如果ajax響應會成功，那麼會顯示alert box並重定向到另一個頁面。Bootstrap Alert當重定向時關閉

我的問題是什麼時候收到成功響應，然後警報顯示正確提示，但當重定向時間提醒框消失。

我想警告框也顯示重定向完成一段時間後，慢慢fadout。

這裏我使用$('.flash_alert').delay(5000).fadeOut("slow");延遲（5000），我認爲它讓我的警報在重定向後可見但不起作用。

我的代碼

的index.php

<div class="flash_alert"> 
</div> 
<button class="btn btn-success btn-lg" type="button" id="PIDetails-1_btn" name="PIDetails-1_btn">Save</button> 


$(document).ready(function() { 
    $("#PIDetails-1_btn").click(function(){ 


     $.ajax({ 
      url: "ajax.php", 
      type: 'POST', 
      dataType : "json", 
      success: function(response){ 

       $(".flash_alert").html(response.msg).delay(5000).fadeIn(); 
       $('.flash_alert').delay(5000).fadeOut("slow"); 
       if (response.status == "success") { 

         window.location.href = "success.php"; 

       } 
       else { 

       } 


      }, 
      error : function(XMLHttpRequest, textStatus, errorThrown) { 
       window.location.reload(); 
      }, 
     }); 
    }); 
});

ajax.php

$data1['status'] = "success"; 
    $data1['msg'] = '<div class="alert alert-success fade in"><a href="#" data-dismiss="alert" class="close">×</a><h5> Successfully Saved. </div>'; 
    echo json_encode($data1);

我需要幫助

來源

2017-02-12 Blied1952

重定向加載了一個沒有提示的新頁面。我會立即重定向並在success.php頁面上顯示警報（並將其淡入）。 – Sim

Blied1952，你所追求的是更普遍相關的功能與單頁應用程序。這些Web應用程序通常不會完全更換完整的DOM，因此無法完全跳出允許彈出窗口在多個頁面上保留的新資源。自從習慣jQuery以來，一個很好的開始是http://sammyjs.org/。

作爲臨時解決方案，如果必須按照網站當前的工作方式完成，您可以在頁面加載時重新創建彈出窗口。

<script type="text/javascript"> 
    jQuery(function(){ // Equivalent to jQuery.ready(); 
    jQuery.ajax({ 
     "url": "ajax.php", 
     "type": 'POST', 
     "dataType" : "json", 
     "success": function(response){ 
      // Add content to popup. 
      $(".flash_alert").html(response.msg); 
      $('.flash_alert').delay(5000).fadeOut("slow"); 
     } 
    }); 
    }); 
</script>

如果此頁面是通過許多不同的方式到達，那麼你可以通過一個GET參數到指定的頁面重定向，以確保彈出只出現在適當的時候。希望這可以幫助。祝你好運。

來源

2017-02-12 17:12:08

Bootstrap Alert當重定向時關閉

的index.php

ajax.php

回答

相關問題