Localstorage少し助けが必要

Question

私はlocalstorageを理解しようとしており、少し問題が発生しました。 次のコードを追加すると、ボタンを押すまで番号がゼロになります。しかし、私はサイトをリフレッシュしたときに最新の番号を表示したい。

function CollectCoin() { 
    if(typeof(Storage) !== "undefined") { 
     if (localStorage.clickcount) { 
      localStorage.clickcount = Number(localStorage.clickcount)+1; 
     } else { 
      localStorage.clickcount = 1; 
     } 
     document.getElementById("result").innerHTML = "Total coins: " + localStorage.clickcount; 
    } else { 
     document.getElementById("result").innerHTML = "Sorry, your browser does not support web storage..."; 
    } 
} 

誰かが私にこの問題を助け、これを解決するために何をすべきか説明してくれることを願っています。

Answer 1

あなたはそれが数を表示します。それは簡単な関数よりも複雑である

https://jsfiddle.net/ed5unzf6/1/

HTML：

<div id="result">Total coins: 0</div> 
<button id="coinButton">Collect Coins</button> 

Javascriptを：

//Check if Local Storage is available 
if (typeof(Storage) == 'undefined'){ 
    document.getElementById("result").innerHTML = "Sorry, your browser does not support web storage..."; 
}else{ 

    display(); //display the coin count 
    //when user click the button, it adds 1 
    document.getElementById('coinButton').addEventListener('click', addcoin); 
} 

function addcoin() { 
    localStorage.clickcount = Number(localStorage.clickcount)+1; 
    display(); 
} 

//display function 
function display() { 

    //Check if clickcount is available. Only Number is tested, so use isNaN 
    if (!localStorage.clickcount || isNaN(localStorage.clickcount)){ 
    localStorage.clickcount = 0; 
    } 
    document.getElementById("result").innerHTML = "Total coins: " + Number(localStorage.clickcount); 
} 

Answer 2

それがここで働いてご覧ください。https://jsfiddle.net/nueffmvm/

function CollectCoin() { 
    if(localStorage) { 
     if(localStorage.clickCount == "NaN"){ 
      localStorage.clickCount = 1; 
     } 
     else{ 
      localStorage.clickCount++; 
     } 
     document.getElementById("result").innerHTML = "Total coins: " + localStorage.clickCount; 
    } 
    else { 
     document.getElementById("result").innerHTML = "Sorry, your browser does not support web storage..."; 
    } 
}