jQuery成功后，重新加载页面并追加内容？

Question

我有以下代码：

$.ajax({
        type: 'GET',
        url: 'edit_slides.php',
        data: { user_id: user_id },
        success: function() { 
            location.reload(); 
            $('#messageContent').append('<p>success</p>'); 
        }
    });

目前的情况是它会追加然后快速重新加载，所以会丢失消息。

现在，我可以去掉重新加载，这样就可以追加了，但为了使我的更改生效，页面需要重新加载。

还有其他方法吗？我想在重新加载页面后显示成功消息。

谢谢！

- Drew

Answer 1

location.reload()会重新加载你的页面，这将向服务器发送一个新的请求，然后浏览器加载响应。你可以在查询字符串中添加一个参数来传递消息，例如：

$.ajax({
        type: 'GET',
        url: 'edit_slides.php',
        data: { user_id: user_id },
        success: function() { 
            window.location = "?message=success";
        }
    });

然后在服务器端代码中，如果参数存在，则可以显示消息。在ASP.NET MVC中，代码如下：

@if(Request["message"] == "success")
{
    <p>success</p>
}

如果您没有服务器端脚本可用，您也可以使用JavaScript解析查询字符串（参考链接）。

- jrummell

Answer 2

重新加载页面之前可以添加一些延迟。尝试以下操作：

$.ajax({
        type: 'GET',
        url: 'edit_slides.php',
        data: { user_id: user_id },
        success: function() { 
            $('#messageContent').append('<p>success</p>'); 
            setTimeout(function(){
               location.reload(); 
            }, 500);
        }
    });

- ShankarSangoli

---

500毫秒并不能给用户足够的时间来阅读消息。 - doogle

Answer 3

将其发送到一个带有URL中哈希标记的位置以表示成功：

$.ajax({
    type: 'GET',
    url: 'edit_slides.php',
    data: { user_id: user_id },
    success: function() { 
        window.location = window.location + "#success";
    }
});

现在当页面加载时，检查哈希值：

$(document).ready(function(){
    if(window.location.hash) {
        $("#messageContent").append("<p>success</p>");
    }

- doogle