3

单击链接时，我正在使用 jQuery 加载页面内容，

$(document).on('click', 'nav a', function (e) {
    e.preventDefault();

    var url = $(this).attr("href");
    window.history.pushState('', '', url);
    url += " #main_wrapper > *";

    $('#main_wrapper').load(url);

});

问题是当我单击“后退”按钮时，URL 发生变化，但什么也没有发生。单击“后退”按钮后，如何再次加载内容？

当单击新链接时，如何停止/取消现有加载？

谢谢。

编辑：

这就是我实现它的方式，您可以根据需要轻松修改它。

window.onpopstate = function(event) {

    $('aside nav a').removeClass('active');
    $('a[href="' + document.location + '"]').addClass('active')

    $('#main_wrapper').load(document.location +" #main_wrapper > *");

};
4

1 回答 1

1

单击后退按钮时如何再次加载内容？

您需要将事件处理程序分配给popstate事件以处理“后退”按钮按下，如此处所述。使用此处理程序，您可以分析当前的历史状态并相应地扩充您的页面。

当单击新链接时，如何停止/取消现有加载？

不幸的是，您不能使用 来执行此操作.load，因为它会返回 'originator' jQuery 对象。但是，如果您将其转换为更底层的$.ajax调用（哪个success函数应该将响应加载到带有 的元素中.html()，您可以调用.abort返回的 jqXHR 对象。

于 2012-12-24T21:29:57.997 回答