使用HTML5 localStorage存儲用戶突出顯示的行

Question

我有一個javascript函數，每次用戶將一行突出顯示到數組時都會添加一個表行ID，然后當用戶取消突出顯示同一行時，也會從數組中刪除相應的ID。

每行都有一個唯一的ID字段。

我一直在嘗試使用localStorage來記住用戶在多個會話中在數組中突出顯示了哪些行，以便如果他們關閉瀏覽器並稍后返回，我可以從該數組中讀取並自動突出顯示先前突出顯示的行。

從我對localStorage的閱讀中，我陷入了如何獲取它的localStorage部分來記住數組的問題，它不僅支持字符串數組。 我需要做的就是存儲一個數字數組，以便每次加載頁面時都可以讀取。

var selectedTeams = [];
var teamIndex;

$('#leaderboard').on('click', 'tr', function() {
    if($(this).hasClass('highlight')){
          $(this).removeClass('highlight')
          teamIndex = selectedTeams.indexOf(this.getAttribute('id'))
          selectedTeams.splice(teamIndex,1)
    }
    else {
          $(this).addClass('highlight')
          selectedTeams.push(this.getAttribute('id'))
    }
});

關於從這里出發的任何建議將不勝感激。

干杯

Answer 1

對於一個簡單的示例，您將執行類似的操作（Dave提到了）。

假設您已經對所有有效的localStorage功能進行了檢查。

var someArray = ['<tr><td>test 3</td></tr>','<tr><td>test</td></tr>','<tr><td>test 3</td></tr>']

window.localStorage.setItem('mySavedArray',JSON.stringify(someArray));

then to get it:

JSON.parse( window.localStorage.getItem('mySavedArray') );