当页面重新加载而不是 Cookie 时，如何存储我的 li 类（“活动”）？答案

【问题标题】：How to store my li class ("active") when page reloaded other than Cookie?当页面重新加载而不是 Cookie 时，如何存储我的 li 类（“活动”）？
【发布时间】：2015-08-04 09:15:52
【问题描述】：

在我的菜单选项卡中，li 元素将在元素点击时“激活”。

刷新页面时..我将值存储在 cookie $.cookie("li", this.id); - 这很好。

但是当我从本地主机或在任何环境中加载网站时，这个 cookie 值存储的会引发错误的菜单...

这意味着在加载网站时，cookie 发送旧值并使另一个菜单处于活动模式，但我在不同的菜单中。

如何以不同的方式获得这一点。？

        //li Elements

       <li id="Projectsnavtab">
       <li id="Homenavtab">
       <li id="AboutUsnavtab">
       <li id="ContactUsnavtab">


       // Jquery Onclick function 
       var navTopList = $(".siteNav > ul > li").
       $(navTopList).on('click', function () {
       $(navTopList).removeClass('active');
       $(this).addClass('active');           
       $.cookie("li", this.id); - Assigning to Cookie
});

      // Getting the value from cookie when page loaded
         var li = $.cookie("li");
         if (li) $("#" + li).addClass("active");

【问题讨论】：

navTopList 是什么？
试试localStorage：developer.mozilla.org/en/docs/Web/API/Window/localStorage
工作正常jsfiddle.net/wMN7G/200
@Jai 编辑了问题 its navTopList = $(".siteNav > ul > li"),
在本页读写cookie"li"，在其他页面删除cookie"li"，也可以使用onunload事件删除cookie，但浏览器不同

标签： javascript jquery asp.net-mvc jquery-ui c#-4.0

【解决方案1】：

你可以使用Html5的localstorage。

localstorage.setItem('id', 'linkid');

你可以这样理解

var linkId = localstorage.getItem('linkid');

【讨论】：

【解决方案2】：

也许你可以使用 url hash(#xxx)
当点击一个li时，给它一个不同的hash，#1,#2,#3...，你可以通过js获取hash，然后使li激活。
刷新页面时不会丢失hash，所以可以得到相同的hash。
当您从其他页面重定向此页面时，它不会带有哈希，因此您可以将默认 li 设置为活动

顺便说一句，我认为 localStorage 不能解决这个问题。它只是改变你在哪里可以找到数据，它不会改变逻辑。

【讨论】：