JSON和localStorage的問題

這是我使用JSON文件：JSON和localStorage的問題

{ 
     "dat": [ 
      { 
       "name": "Bill", 
       "age": 20 
      } 
     ] 
    }

這是實際源（簡單化了，只顯示錯誤），我使用。因此，請隨意將其放入HTML文件和修補程序中。

<!DOCTYPE html> 
    <html> 
    <head> 
    <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script> 
    </head> 
    <body> 
    <div id="out"></div> 
    <script type="text/javascript"> 

    /****************** 
    * Global Variables 
    ******************/ 
    var counter = 1; //Used to track users movement 
    var json; 


    Storage.prototype.setObject = function(key, value) { 
     this.setItem(key, JSON.stringify(value)); 
    } 

    Storage.prototype.getObject = function(key) { 
     var value = this.getItem(key); 
     return value && JSON.parse(value); 
    } 


    function load(location, storageName) 
    { 
     $.ajax({ 
      url: location, 
      dataType: "text", //force to handle it as text 
      success: function(data) 
      { 
      localStorage.setObject(storageName, JSON.parse(data)); 
      } 
     }) 
    }; 

    /**************************** 
    * Pushes any content updates to the user. 
    ****************************/ 

    function populate(Number) 
    { 
     $.each(json.dat, (function(key, value) 
     { 
      $('#out').html('Name: ' + value.name + '<br> Age: ' + value.age); 
     })) 
    } 


    /******************************** 
    * The main program 
    ********************************/ 

    $(document).ready(function(){ 
    load('work.json', 'jsoncache'); 
    json = localStorage.getObject('jsoncache'); 
    populate(counter); 

    }) 
    </script> 
    </body> 
    </html>

我遇到的問題是第一次加載應用程序時，它會在控制檯中引發錯誤。第二次，你加載它（只需點擊刷新），它工作得很好。

我在更改數據和刷新時發現此問題。如果我更改了數據並刷新了，localStorage會加載和更新數據，但顯示在屏幕上的文本將是相同的。再次點擊刷新，屏幕上的文本將顯示新數據（上次刷新頁面時加載的數據）。

我發現另一件事是，如果你不具有localStorage的現有運行應用程序時，它拋出一個不同的錯誤。任何人都知道這件事？

我不確定它是我的代碼中的錯誤還是瀏覽器的問題。有什麼想法嗎？

來源

2014-03-06 flockerman

你的「加載」功能進行的** **異步操作。該功能將在瀏覽器實際接收數據之前返回。 – Pointy

也注意localStorage存儲字符串，所以你的'localStorage.setObject（storageName，JSON.parse（data））;'錯誤應該只是'localStorage.setObject（storageName，data）;' –

您嘗試在您的AJAX請求返回之前從localStorage中獲取項目，因此，在填充方法中，當您嘗試訪問json.dat時，由於json的格式爲undefined，您將得到一個錯誤。但第二次，異步請求已經存儲了該對象，因此它可以工作。更改負載功能：

function load(location, storageName) 
{ 
    $.ajax({ 
     url: location, 
     dataType: "text", //force to handle it as text 
     success: function(data) 
     { 
     json = JSON.parse(data); //Why don't you use 'json' dataType directly? 
     localStorage.setObject(storageName, json); 
     populate(counter); 
     } 
    }) 
};

而且你的負載（）調用之後，從就緒（）方法都刪除（或檢查錯誤）

來源

2014-03-06 20:25:50

JSON和localStorage的問題

回答

相關問題