如何在单击后退和前进按钮时创建 onpopstate 事件答案

【问题标题】：How to create onpopstate event on click back and forward button如何在单击后退和前进按钮时创建 onpopstate 事件
【发布时间】：2016-03-01 19:15:35
【问题描述】：

我创建了一个 jquery ajax 代码来使用 pushstate 显示内容，它工作得很好，但是当我点击后退和前进按钮时，内容不会再次改变。在这种情况下如何创建事件onpopstate？

    <script>
    $(document).ready(function () {

        $(".load-ajax").click(function (e) {
            e.preventDefault();
            var route = $(this).attr('href');

            $.ajax({
                type: 'get',
                dataType: 'json',
                url: Routing.generate('admin_order_state_new'),
                success: function (msg) {
                    if (msg["ok"] === undefined) {
                        alert('error');
                    } else {
                        window.history.pushState(null, "Title", route);

                        $("#mydiv").html(msg["ok"]);
                    }
                }
            });
            return false;
        });

    });

</script>

【问题讨论】：

标签： jquery ajax history

【解决方案1】：

解决了

$(document).ready(function () {

function loadPage(route) {
    $.ajax({
        type: 'get',
        dataType: 'html',
        url: route,
        success: function (msg) {
            if (msg === undefined) {
                alert('error');
            } else {
                $('#content').replaceWith(
                    // with the returned one from the AJAX response.
                    $(msg).find('#content')
                );

            }
        }
    });
}

$(window).on('popstate', function () {
    loadPage(location.pathname);
});

$(".load-ajax").click(function (e) {
    e.preventDefault();
    var route = $(this).attr('href');

    window.history.pushState(null, "Title", route);

    loadPage(route)

 });


});

【讨论】：