2016-11-23 45 views
-1

我從形式存儲我的數據中的localStorage以以下格式:每次用戶提交表單時顯示在目前的localStorage對象的所有網頁上的

Object {title: "dsadasds", dueDate: "dsadasdsa", summary: "dsadadas", body: "dasdasdas"} 
Object {title: "dasdadsa", dueDate: "dasdasdadasda", summary: "dsadasdasd", body: "dasdasdas"} 

此數據存儲在localStorage的。現在在一個不同的頁面'localhost:3000/notes'我想要顯示存儲在localStorage中的所有這些對象。目前使用下面的代碼,它只顯示提交的最後一個對象。

 var form = $('#form'), 
     formTitle = $('#title'), 
     formDueDate = $('#dueDate'), 
     formSummary = $('#summary'), 
     formBody = $('#body'); 

     var title = formTitle.val(); 
     var dueDate = formDueDate.val(); 
     var summary = formSummary.val(); 
     var body = formBody.val(); 
     var newContent2 = $('#new-content2') 

     var test = {}; 
     test = { 
      title: title, 
      dueDate: dueDate, 
      summary: summary, 
      body: body 
     } 

     localStorage.setItem('test', JSON.stringify(test)); 
     var LocalStoredData = JSON.parse(localStorage.getItem('test')); 
     console.log(LocalStoredData); 

     //for retrieving data from locastorage 
     var retrievedData = localStorage.getItem('test'); 
     var text = JSON.parse(retrievedData); 
     var showTitle = text["title"]; 
     var showDueDate= text["dueDate"]; 
     var showSummary = text["summary"]; 
     var showBody = text["body"]; 

     $('#showTitle').html(showTitle); 
     $('#showDueDate').html(showDueDate); 
     $('#showSummary').html(showSummary); 
     $('#showBody').html(showBody); 

我需要循環槽的所有對象(或任何其他機制)從localStorage的提取所有的對象,並在網頁上適當的div顯示它們。我試圖把檢索代碼放在循環中:

for(var i=0;i<localStorage.length;i++) 

但是使用這個循環它沒有顯示任何東西。如何顯示我的localStorage中存在的所有對象。

+0

localStorage的是一個key-value存儲。你在哪個關鍵字下保存你的對象?您是否考慮過只使用一個鍵並保存整個對象數組? –

回答

1

您正在尋找

for (var i=0; i<localStorage.length; i++) { 
    var key = localStorage.key(i); 
    var item = localStorage.getItem(key); 
    try { 
     item = JSON.parse(item); 
    } catch(e) { 
     console.log(key+" is not in JSON format"); 
    } 
    … 
} 
0

您也可以輕鬆使用Object.keys得到的localStorage的所有內容:

Object.keys(localStorage).forEach(key => { 
    console.log(key, localStorage.getItem(key)) 
}) 
+0

這也可以得到'.length'鍵 – Bergi

相關問題