javascript - getitem 本地存储不工作

Question

我正在尝试为菜单设置事件项目 cookie。

所以我使用本地存储来完成此任务。当菜单项处于事件状态时，它会像这样存储在本地存储中 -

  <script type="text/javascript">
        $(function () {
            $('.nav-pills>li').click(function () {
                $(this).siblings().removeClass('active');
                $(this).addClass('active');

                var activeIndex = $(this).index();
                alert("Before pageload active item is "+ activeIndex);
                localStorage.setItem('mySelectValue', activeIndex);

            });
        });

    </script>

菜单看起来像-

然后我在窗口加载时设置此事件项目-

  <script type="text/javascript">
        $(window).load(function () {
            var activeIndex = localStorage.getItem('mySelectValue');
            alert("After pageload active item is " + activeIndex);

            $('.nav-pills li:nth-child("' + activeIndex + '")').addClass('active');

        });

    </script>

现在菜单-

在这里您可以从两个图像中看到事件菜单的索引仍然是页面加载之前的最后一个索引。但这并没有在此菜单项上应用 .active 类。

如何将此菜单项设置为事件状态？

Answer 1

更改自

$('.nav-pills li:nth-child("' + activeIndex + '")').addClass('active');

到此

$('.nav-pills li:eq("' + activeIndex + '")').addClass('active');

或删除双引号

 $('.nav-pills li:nth-child(' + activeIndex + ')').addClass('active');

但是第 n 个子级是从 1 开始的索引，而 eq 是从 0 开始的索引

检查http://jsfiddle.net/HLUB9/2/