0

我在一个网站上工作，想在 localStorage 中存储一个类，尽管我遇到了一些问题。

这是HTML：

<ul class="type">
  <li id="1" class="current">Example 1</li>
  <li id="2">Example 2</li>
</ul>

我有一些 jQuery 在单击时向其中一个示例添加一个类。

当类current处于活动状态时，它会更改站点上的一些值。基本上，当您访问该站点时，#1已经有了类current，但是如果我添加类 the #2，我想localStorage记住哪个元素具有类current。

这是我到目前为止所写的，localStorage但我认为它不正确。（PS 我正在使用 Modernizr）。

function temp_type(){
  var type = $('.type li').hasClass('current');
}

$('#1').click(function() {
  $('#2').removeClass('current');
  $(this).addClass('current');
  if(Modernizr.localstorage) localStorage.setItem('temp_type'), $('.type li').hasClass('current');
});

$('#2').click(function() {
  $('#1').removeClass('current');
  $(this).addClass('current');
  if(Modernizr.localstorage) localStorage.setItem('temp_type'), $('.type li').hasClass('current');
});

if(Modernizr.localstorage){
  var type = localStorage.getItem('temp_type');
  if(type){
    $('.type li').hasClass('current');
    temp_type();
  }
}

另外，有没有办法测试是否localStorage工作？

4

1 回答 1

0

这可以用简单的方式写，试试下面的

HTML

<ul class="type">
  <li id="1">Example 1</li>
  <li id="2">Example 2</li>
</ul>
<br />
<a href="javascript:void(0);">Check Storage</a>

脚本

$(document).ready(function(){
    $('.type li').on('click', function(event){
        $('.type li').removeClass('current');
        $(this).addClass('current');
        if(Modernizr.localstorage){
            window.localStorage['temp_type'] = $(this).attr('id'); /*Storing the id of the selected element*/
        }
    });

    $('a').on('click', function(event){ 
        alert(window.localStorage['temp_type']); /*Check the current storage*/
    });
});

CSS

li.current {
    color: red;
}

演示 JS http://jsfiddle.net/5vmBe/3/

希望这会帮助你。

于 2013-05-05T18:05:11.720 回答