0

我设法让我的主导航工作，以便 JQ 从另一个文件加载内容 HTML 并将它们作为我的主要内容 div 的 innerHTML。但是，每次我刷新页面时，它都会返回到文件的默认状态，即没有通过 JQ 动态更改的内容。此外，由于 URL 保持不变，我无法找到一种方法来链接到具有更改内容的索引页面。关于如何做这些事情的任何想法？

这是用于动态更改内容的函数：

$(document).ready(function() {                                                                                                                            
  $('#menu_items').on('click', '#menu_items a', function(event) {                                                                                   
    event.preventDefault();                                                                                                                   
    var href = $(this).attr('href');                                                                                                          
    $('#main_content').load(href);                                                                                                            
  });
});
4

2 回答 2

0

如果我理解正确，您的问题是您没有将在客户端上所做的更改推送到服务器，或以任何方式存储它们。你有几个选择：

  • 在服务器上创建一个允许对 HTML 文件进行更改的 servlet（我不建议这样做，因为在客户端上所做的任何更改都会转移到所有其他客户端）。
  • 使用 cookie：您可以在对文件进行更改时放置一个 cookie，以便在页面刷新时加载更改
  • 使用 HTML 5 本地存储：与 cookie 的概念相同，但更新且可能更好。
于 2012-08-15T00:39:10.350 回答
0

我完全从另一个网站http://www.quirksmode.org/js/cookies.html窃取了这些功能， 但这正是您需要做的事情。

function createCookie(name,value,days) {
    if (days) {
        var date = new Date();
        date.setTime(date.getTime()+(days*24*60*60*1000));
        var expires = "; expires="+date.toGMTString();
    }
    else var expires = "";
    document.cookie = name+"="+value+expires+"; path=/";
}

function readCookie(name) {
    var nameEQ = name + "=";
    var ca = document.cookie.split(';');
    for(var i=0;i < ca.length;i++) {
        var c = ca[i];
        while (c.charAt(0)==' ') c = c.substring(1,c.length);
        if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
    }
    return null;
}

function eraseCookie(name) {
    createCookie(name,"",-1);
}

$(document).ready(function() { $('#main_content').load($("#"+readCookie("content")).attr('href')); $('#menu_items').on('click', '#menu_items a', function(event) { event.preventDefault(); var href = $(this).attr('href'); $('#main_content').load(href); createCookie("content",$(this).attr('id'), 1); }); });

只需确保您的所有菜单链接都有一个 ID，否则您将不得不稍微更改此代码。

于 2012-08-15T00:46:16.307 回答