存储在localstorage中的变量在页面刷新时消失

这是一个网页，您可以从三个单选按钮中选择背景图片。我想将所选的一个保存在本地存储中，因此当页面刷新时，最后一个选定的背景图像将被刷新。情况并非如此，我不明白为什么，是吗？在此先感谢:)存储在localstorage中的变量在页面刷新时消失

<!DOCTYPE html> 
    <html manifest="my.manifest"> 
    <head> 
    <script src="modernizr.js"></script> 

    <script> 
    function setBg() { 
     myForm = document.getElementById("bgList"); 
     for (var i = 0; i < myForm.land.length; i++) { 
      if (myForm.land[i].checked) { 
       break 
      } 
     } 
     document.body.style.backgroundImage="url('" + myForm.land[i].value + "')"; 

     if (Modernizr.localstorage) { 
      localStorage.setItem("background", i); 
      //alert(localStorage.getItem("background")); 
     } 
     else{ 
      alert("Can not be saved to localstorage!"); 
     } 
    } 
    </script> 
    </head> 

    <body> 

    // Sørger for å velge et bakgrunnsbilde når siden lastes 
    <script src="modernizr.js"> 
     window.onload = function(e){ 
      mittLand = 0; 
      if (localStorage.getItem("background") != null) { 
       mittLand = parseInt(localStorage.getItem("background")); 
       alert(mittLand); 
      } 
      myForm = document.getElementById("bgList"); 
      myForm.land[mittLand].checked=true; 
      setBg(); 
     } 
    </script> 

    <form id="bgList"> 
     <h1>Velg ditt favorittland</h1> 
     <input type="radio" name="land" value="norge.png" onClick="setBg()">Norge</input> 
     <input type="radio" name="land" value="sverige.png" onClick="setBg()">Sverige</input> 
     <input type="radio" name="land" value="danmark.png" onClick="setBg()">Danmark</input> 
    </form> 

    </body> 
    </html>

来源

2013-03-26 Maiken Beate Fjellanger

我不明白什么部分不起作用？该警报正确显示选定的选项，但由于您在设置背景之前正在执行警报，因此在按警报图像设置正确后，背景不是警报时的样式。

<!DOCTYPE html> 
<html> 
<head> 
    <script src="http://modernizr.com/downloads/modernizr-latest.js"></script> 

    <script> 
     function setBg() { 
      myForm = document.getElementById("bgList"); 
      for (var i = 0; i < myForm.land.length; i++) { 
       if (myForm.land[i].checked) { 
        break 
       } 
      } 
      document.body.style.backgroundImage="url('" + myForm.land[i].value + "')"; 

      if (Modernizr.localstorage) { 
       localStorage.setItem("background", i); 
       //alert(localStorage.getItem("background")); 
      } 
      else{ 
       alert("Can not be saved to localstorage!"); 
      } 
     } 
    </script> 
</head> 

<body> 

// Sørger for å velge et bakgrunnsbilde når siden lastes 
<script> 
    window.onload = function(e){ 
     mittLand = 0; 
     if (localStorage.getItem("background") != null) { 
      mittLand = parseInt(localStorage.getItem("background")); 
      alert(mittLand); 
     } 
     myForm = document.getElementById("bgList"); 
     myForm.land[mittLand].checked=true; 
     setBg(); 
    } 
</script> 

<form id="bgList"> 
    <h1>Velg ditt favorittland</h1> 
    <input type="radio" name="land" value="norge.png" onClick="setBg()">Norge</input> 
    <input type="radio" name="land" value="sverige.png" onClick="setBg()">Sverige</input> 
    <input type="radio" name="land" value="danmark.png" onClick="setBg()">Danmark</input> 
</form> 

</body> 
</html>

试过这个代码的作品。用modernizr更新

来源

2013-03-26 23:50:47 Astronaut

警报仅用于测试，并不重要。重要的是，当我将这些信息保存在本地存储中时，我希望在刷新页面后进行检索。但是（localStorage.getItem（“背景”）总是恢复为“空”。我不明白为什么。） – 2013-03-27 00:51:22

我试过了上面的代码，只是删除了modernizer，它的工作原理 – Astronaut 2013-03-27 00:57:39

非常感谢！= D你明白它为什么起作用没有modernizer？真的想要了解所有这些:) – 2013-03-27 01:01:56

存储在localstorage中的变量在页面刷新时消失

回答

相关问题