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

Question

我创建了一个 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>

Answer 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)

 });


});

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

How to create onpopstate event on click back and forward button

ajax

jquery

history