Html本地存储存储数据

Question

我有一个简单的主菜单程序。

IT工作方式：

简单地说，一旦您单击第一级并单击“已完成”按钮，它就会解锁到第二级，问题是当您刷新页面时，它不会保存它，而第二级将再次消失。

我尝试过的代码：

我尝试了HTML Local storage，下面是我使用的一些例子

window.highestLevel = localStorage.getItem('highestLevel'); 

像那样的东西，但我不能让它来拯救水平。

--请帮助这里是一个链接。 http://jsfiddle.net/ptcbkamx/1/

注意:我想使用html本地存储。

Answer 1

把它存起来

window.localStorage.setItem('highestLevel', window.higestLevel);

Answer 2

请确保检查正在使用的浏览器是否支持本地存储。您可以很容易地使用现代派或其他什么东西来完成这个任务。

要在本地存储中设置某些内容：

javascript

localStorage.setItem('your-identifier', your-data);

例如，要保存用户名：

javascript

localStorage.setItem('username', 'Luke Skywalker');

要从本地存储获取“用户名”，请执行以下操作：

javascript

localStorage.getItem('username');

希望这能有所帮助！

Answer 3

在加载页面时，您需要使用getItem (正如您在问题中所做的那样)，并根据需要隐藏级别2：

if (localStorage.getItem("highestLevel") <= 1) {
    $("#level2").hide();
}

当用户达到2级时，您还需要setItem来保存：

function mainMenuLvl2() {
    localStorage.setItem("highestLevel", 2)
    $('#level2').show();
}

这里有一个JSFiddle：http://jsfiddle.net/ptcbkamx/2/