0

我有一个使用 jQuery 的 ajax 站点，我想知道如何允许用户刷新页面并加载适当的内容。

我有它，所以当用户单击具有我的网站域的 href 属性的元素时，该页面的内容会加载到主 div 中。加载的 html 内容只是一个完整的 html 文档，所以我没有加载页面片段。我正在使用 History.js 来检查 URL 和 hashchanges。但是当我刷新页面时，只加载静态内容（无样式），而不是包含主页的页眉和页脚。另一个问题是我需要清除现有哈希以避免 GET 404 错误。我显然想要的是整个页面正常加载。

到目前为止，这是我的代码：

jQuery(document).ready(function() {
    // Prepare
    var History = window.History; // Note: We are using a capital H instead of a lower h
    if ( !History.enabled ) {
        console.log("History is not enabled.");
         // History.js is disabled for this browser.
         // This is because we can optionally choose to support HTML4 browsers or not.
        return false;
    }
    else {
        console.log("History is enabled");
    }

    //vars for history
    var changes = 0;
    // Bind to StateChange Event
    History.Adapter.bind(window,'statechange',function(){ // Note: We are using statechange instead of popstate
        var State = History.getState(); // Note: We are using History.getState() instead of event.state
        History.log(State.data, State.title, State.url);
    });

    $("a").click(function(e) {
        e.preventDefault();
        $("#content").load(this.href, function() {
            // Change our States
            changes++;
            History.pushState({state:changes}, "State " + changes, "#" + this.href); // logs {state:1}, "State 1", "?state=1"
        });
});
4

1 回答 1

1

你在使用HTML5吗？您可以使用本地持久性方法来维护已通过 ajax 加载的项目，或存储任何特定的键、在加载或刷新页面时填充所需内容所需的 id。

如果没有 HTML5，则可以选择 jQuery.data，但我认为您无法在页面刷新之前捕获/存储持久性项目，因此这不太可能是一个可行的解决方案- 所以我唯一可以选择的其他选项想到的是使用cookie（在内存中，通过JavaScript（jQuery）创建） - 作为一种解决方案，这将是一场噩梦（可能）有很多不同的点来同步所有状态，以便刷新/重新加载填充正确的东西....但如果设计得当它可以为你工作。

于 2012-06-15T15:59:06.990 回答