HTML5 LocalStorage與我的變量搞砸

Question

我是新來的HTML和Javascript，並瞭解它我正在做一個增量遊戲（類似於CookieClicker或CivClicker）。

我試圖保存和加載進度，我可以保存它只是很好，但是當我加載它，它會正確加載所有的變量，但是當我點擊一個按鈕增加一個變量，它會做一些奇怪的東西，這很難解釋，我會發布代碼，所以你可以再看看它。

JSFiddle Here

function loadProgress() { 
    if (typeof (Storage) !== "undefined") { 
     progress = localStorage.progress; 
     speed = localStorage.speed; 
     quality = localStorage.quality; 
     isDone = localStorage.isDone; 
     totalMoney = localStorage.totalMoney; 
     speedCost = localStorage.speedCost; 
     gamesSold = localStorage.gamesSold; 
     autoclick = localStorage.autoclick; 
     autoclickCost = localStorage.autoclickCost; 
     currentBugs = localStorage.currentBugs; 
     refreshDisplay(); 
    } else { 
     console.log("LocalStore not appliable.") 
    } 
} 

按 '設計'，直到你到達100％，然後點擊 '賣你的遊戲'。然後只需點擊保存進度然後點擊進度並點擊設計並再次出售遊戲，您會看到數字增加得非常奇怪，而且根本沒有預料到。

'ShowMeTheMoney'將向您顯示控制檯中的變量，以便您可以驗證變量是否已正確存儲。

我不知道爲什麼會發生這種情況，所以如果有人能幫上忙，那就太棒了。

Answer 1

本地存儲又名Web存儲，將值存儲爲字符串，因此當您檢索值時需要將/ cast轉換爲數字，否則這些變量將保持爲字符串，您將看到串聯，而不是將值遞增。例如1 + 1變成11而不是2。

Updated working fiddle

有轉化爲數字的多種方式，一種方式是+方法：

progress = +localStorage.progress; 
speed = +localStorage.speed;  
quality = +localStorage.quality;