如何正确使用本地存储？

问题描述：

编辑：由于我的问题似乎不清楚，我将重述我的问题。如何正确使用本地存储？

我需要：在本地存储

存储变量。我有一个按钮可以做到这一点。
检索变量的值，但只有当本地存储中有任何值时。如果没有，那么我想设置标准值。
删除本地存储。我也有一个按钮。

我在这种情况下使用下面的代码，但变量scrapMetal总是返回为true。

的Javascript：

//Been to variables 
var beenToPrison = true; 

//Item variables 
var scrapMetal = false; 

//Room variables 
var currentRoom = 'prison'; 

//Mission variables 
var currentMission = 'breakOut'; 

//Store 
$("#media-icon1").click(function() { 
    if (Modernizr.localstorage) { 
     localStorage.setItem("curmission", currentMission); 
     localStorage.setItem("curroom", currentRoom); 
     localStorage.setItem("scrpmtl", scrapMetal); 
     localStorage.setItem("beenprison", beenToPrison); 
     addText($('<p>Game saved.<br><br></p>')) 
    } 
    else { 
     addText($('<p>Browser does not support saving.<br><br></p>')) 
    } 
    console.log(scrapMetal); 
}); 

//Remove storage 
$("#media-icon2").click(function() { 
    if (Modernizr.localstorage) { 
     localStorage.removeItem('curroom', 'beenprison', 'scrpmtl', 'curmission'); 
     addText($('<p>Save erased.<br><br></p>')) 
    } 
    else { 
     addText($('<p>Browser does not support saving so there is nothing to delete.<br><br></p>')) 
    } 
    console.log(scrapMetal); 
}); 

//Add a P element to the placeholder in the focus screen 
var addText = function(el) { 
     el.hide().appendTo('#placeholder').fadeIn(1000); 
    } 

//Check if browser support local storage using a library 
$(document).ready(function() { 
    if (Modernizr.localstorage) { 
     addText($('<p>Your browser supports local storage. Game data can be saved by pressing the save button.<br><br></p>')) 
     scrapMetal = localStorage.scrpmtl; 
     if (scrapMetal === null) { 
      scrapMetal = false; 
     } 
     else { 
      scrapMetal = localStorage.scrpmtl; 
     } 
    } 
    else { 
     addText($('<p>Your browser does not support local storage. Your game can not be saved. Please use another browser or update your current browser.<br><br></p>')) 
    } 
    console.log(scrapMetal); 
});

检查modernizer文档...你确定'如果（Modernizr.localstorage）'不应该'如果（Modernizr.localStorage）'？注意案例的差异。或者只是使用'如果（window.localStorage）' – charlietfl

要在localStorage的设置键，你必须使用setItem为localstorage.setitem（“键名，值），并得到它是localstorage.getItem（”键名“） – Geeky

@charlietfl'localstorage' – Bushido

答

只是想补充一点，该数据应转换为JSON在设置之前。

localStorage.setItem("scrapMetal", JSON.stringify(false)); 
JSON.parse(localStorage.getItem("scrapMetal"));

否则你会看到字符串“false”，而不是布尔值false。

如何正确使用本地存储？

相关推荐