的index.php

Question

这里点击按钮时，ajax请求被调用。如果ajax响应成功，则显示警告框并重定向到另一个页面。

我的问题是收到成功响应然后正确显示警报，但重定向时间警报框消失。

我希望警告框也会在重定向完成后显示一段时间并且慢慢地消失。

这里我使用$('.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);

我需要帮助

Answer 1

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参数传递给名为redirect的页面，以确保仅在适当时显示弹出窗口。希望这可以帮助。祝你好运。

Bootstrap Alert重定向时关闭

的index.php

ajax.php

1 个答案: