读取localStorage数据？

我搞砸了一些JavaScript，我试图找出一种方式来读取localStorage的方式，所以我可以取得成就每10次点击或任何事。代码如下：读取localStorage数据？

<!DOCTYPE> 
<HTML> 
<HEAD> 
<link rel="stylesheet" type="css/text" href="css.css"> 
<script> 
function clickCounter() { 
if(typeof(Storage)!=="undefined") 
    { 
    var ten=10; 
    var value = clickCount; 
if (localStorage.clickcount) 
{ 
localStorage.clickcount=Number(localStorage.clickcount)+1; 
} 
else 
{ 
localStorage.clickcount=1; 
} 
document.getElementById("result").innerHTML="You have clicked the button " +     
localStorage.clickcount + " times."; 
} 
else 
{ 
document.getElementById("result").innerHTML="Sorry, your browser does not support web 
storage..."; 
} 
} 
function clickCounterReset() { 
localStorage.clear(); 
localStorage.clickcount=0; 
document.getElementById("result").innerHTML="You haven't clicked the button once!"; 
} 
function Ach1() { 
if (localStorage.clickcount=10) { 
localStorage.setitem("GetData" , value); 
alert(localStorage.getitem("GetData")); 
document.getElementById("Ach1").innerHTML="Successfully reached 100!"; 
} 
} 
</script> 
</HEAD> 
<BODY class="body"> 
<br> 
<br> 
<div id="Ach1"></div> 
<br> 
<br> 
<center> 
<div class="noLight"> 
<div class="pointlessbutton" style="cursor: pointer;" onClick="clickCounter()"> 
<font color="white" size="4">+1</font> 
</div> 
<br> 
<div class="pointlessbutton" style="cursor: pointer;" onClick="clickCounterReset()"> 
<font color="white" size="4">Reset</font> 
</div> 
</div> 
<div id="result"></div> 
</center> 
</BODY> 
</HTML>

正如您所看到的，点击的实际脚本工作正常，所有HTML也是如此。然而，在它所说的“函数Ach1（）”的底部，我试图让脚本读取数据，并将它与我放入的值比较，比如10，然后让它吐出一些HTML包含在漂亮的CSS中并显示成就。

来源

2013-12-11 user3089082

不确定你想要什么 - 在你的问题= P中没有“？”但是......如果我正确地猜出某些东西跳到我身上.....奇怪....是你有'localStorage.clickcount = 10'。你不是指'localStorage.clickcount == 10'吗？ –

对不起，没有说清楚。如何在10次点击后显示成果？ – user3089082

此外，我已经尝试了/ = ==的每个变体，它只是不起作用。：/ – user3089082

我拿出你的代码BUNCH并试图清理它。

另外，我想指出的是，我看到你只是在学习HTML5的废话。这段代码有一些不良做法，但是对于你想要完成的事情，我认为/希望你能通过采用这种教条（我很懒惰！）来淡化进口数据。

有些事情需要注意的：

JavaScript是大小写敏感的。所以，如果你开始调用变量“clickcounter”，然后尝试引用“clickCounter”，你会遇到一堆错误。
我在下面提供的代码：我在HTML中混合了CSS，在JavaScript中混合了HTML（标签的选择很差）。我看到你有一个CSS文件，好吧 - 是的，你没有发布它，所以我没有访问它。所以我就把它拿出来并在整个过程中添加颜色。
记住console.log("your messages goes here");的力量。这是一个糟糕的调试器/对任何时候你的代码做的事情进行检查。在学习时使用它，以便您可以看到期望值（仅供参考：大多数浏览器具有“开发人员工具” - 如果您使用的是Chrome，则点击F12 - 这样您可以查看CONSOLE消息（以及错误。您的JavaScript作为你运行它）
不要害怕大量使用功能，这是给你的代码组织并强迫自己收拾好做法好方法

这里是代码：。

<HTML> 
<HEAD> 
<script> 
    function clickCounter() { 
     if(typeof(Storage)!=="undefined"){ 
      if (localStorage.clickCount){ 
       localStorage.clickCount=Number(localStorage.clickCount)+1; 
       updateResults(); 
       console.log("Added +1 to Click Count! New value: " + localStorage.clickCount); 
       goldStarNotification(); 
      } 
      else{ 
       clickCounterReset(); // Set the click-counter to 0 
       updateResults(); 
      } 
     } 
    } 

    function updateResults(){ 
     var myCounter = localStorage.clickCount; 
     document.getElementById("result").innerHTML = "You have clicked the button " + myCounter + " time(s)."; 
    } 

    function clickCounterReset(){ 
     console.log("The reset was hit!"); 
     localStorage.clickCount=0; 
     updateResults(); 
    } 

    function goldStarNotification(){ 
     if (localStorage.clickCount == 10){ 
      console.log("You WIN!!! ZOMG!"); 
      document.getElementById("starNotification").innerHTML = "<center><h1>Successfully reached Level 10!</h1></center>"; 
     } 
    } 
</script> 
</HEAD> 
<BODY class="body" bgcolor="black", onLoad="clickCounterReset()"> 
<br> 
<br> 
<div id="starNotification" style="color: white;"></div> 
<br> 
<br> 
<center> 
<div class="noLight"> 
<div class="pointlessbutton" style="cursor: pointer;" onClick="clickCounter()"> 
<font color="white" size="4">+1</font> 
</div> 
<br> 
<div class="pointlessbutton" style="cursor: pointer;" onClick="clickCounterReset()"> 
<font color="white" size="4">Reset</font> 
</div> 
</div> 
<div id="result" style="color: white;">Hey! Update me! :-)</div> 
</center> 
</BODY> 
</HTML>

来源

2013-12-11 01:12:33

读取localStorage数据？

回答

相关问题