2015-10-05 65 views
2

我正在爲我的項目開發一個HTML5遊戲,我的問題在評分系統中。
我想顯示十大最佳評分者(已排序)。我目前正在使用JSON中的Array。如何將數組存儲在localStorage(Javascript)中的JSON?

現在我要救JSON數組中的localStorage

var storage = '{"Players":[' + 
     '{"score":"0","Name":"Player 2"},' + 
     '{"score":"0","Name":"Player 4"},' + 
     '{"score":"0","Name":"Player 1"}]}'; 

var obj = JSON.parse(storage); 

obj['Players'].push({"score": 13,"Name": "Player1"}); 
obj['Players'].push({"score": 523,"Name": "Player2"}); 
obj['Players'].push({"score": 3,"Name": "Player3"}); 
obj['Players'].push({"score": 1235,"Name": "Player4"}); 

storage = JSON.stringify(obj); 

var sortColumnScore = "score"; 

function SortByScore(x,y) { 
    return ((x[sortColumnScore] == y[sortColumnScore]) ? 0 : ((x[sortColumnScore] < y[sortColumnScore]) ? 1 : -1)); 
} 

obj.Players.sort(SortByScore); 

for (var i = 0; i < 5; i++) { 
    document.getElementById("s"+ (i+1)).innerHTML = 
    obj.Players[i].score; 
    document.getElementById("p"+ (i+1)).innerHTML = 
    obj.Players[i].Name; 
}; 
+0

沒有關於本地存儲的代碼。 –

+0

我不知道該從哪裏開始localStorage。 這就是爲什麼我在尋找一些幫助。 :) –

+0

所以代碼片段是完全不相關的,只是檢查 –

回答

0

不能包含對象或數組的localStorage的。但是你可以將它轉換成一個字符串。

// Store the object 
localStorage.myObject = JSON.stringify(myObject); 

// Read the object 
var myObject = JSON.parse(localStorage.myObject); 
+0

是的,但我如何再次訪問它以便我可以對它進行排序並將其顯示在我的項目中? –

+0

使用行'讀取對象' – Magus

+0

我解析對象後,我可以像這樣訪問數組? 'obj.Players [0] .score' –

0

獲取一個項目從localStorage

var str = localStorage.getItem('my-item'); 

存儲項目中localStorage

localStorage.setItem('my-item', str); 

注意:您只能字符串保存到本地存儲,這樣,你將需要通過JSON.stringify將您的數據轉換爲字符串,然後使用從localStorage中檢索字符串時的。

+0

解析後,我可以像這樣再次訪問對象嗎? 'obj.Players [i] .score' –

+0

@DarbsLingo是啊,你可以:) – Buzinas

+0

好吧謝謝,我現在試試看。 (y) –

1

基本上你應該使用本地存儲,就像你上面做的storage一樣。您可以像使用@Magus一樣以對象方式使用localstorage,或以關聯數組的方式使用localstorage,調用其基元getItem,setItem

簡單的用法:

var storage = '{"Players":[' + 
    '{"score":"0","Name":"Player 2"},' + 
    '{"score":"0","Name":"Player 4"},' + 
    '{"score":"0","Name":"Player 1"}]}'; 

var obj = JSON.parse(storage); 

obj['Players'].push({"score": 13,"Name": "Player1"}); 
obj['Players'].push({"score": 523,"Name": "Player2"}); 
obj['Players'].push({"score": 3,"Name": "Player3"}); 
obj['Players'].push({"score": 1235,"Name": "Player4"}); 

localStorage.setItem('Players', JSON.stringify(obj)); 

然後得到localStorage的數據調用:

var myobj = JSON.parse(localStorage.getItem('Players')); 

高級應用:

對於正確的用法(加上當前用戶會話)並初始化localstorage/sessionstorage(根據您的目標)請參閱@ War10ck在此問題Push JSON Objects to array in localStorage之後的評論。

+0

如果我刷新頁面,數據是否會保留? –

+0

有關這些問題,請參閱@Buzinas [Mozilla文檔](https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage)引用的文檔。無論如何,即使關閉窗口並在稍後重新打開,localStorage也會保留數據。 sessionStorage只保留數據在同一會話中(即瀏覽器的相同選項卡),而不是。 – morels

相關問題