讀取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數據？

回答

相關問題