JavaScript的就是HTML5 LocalStorage攪亂代碼

我使用這段代碼對我的形象滑塊......JavaScript的就是HTML5 LocalStorage攪亂代碼

$（文件）。就緒（函數（）{

$("#owl-demo").owlCarousel({ 
    jsonPath : 'json/customData.json', 
    jsonSuccess : customDataSuccess, 
    lazyLoad : true 
    }); 

    function customDataSuccess(data){ 
    var content = ""; 
    for(var i in data["items"]){ 

     var img = data["items"][i].img; 
     var alt = data["items"][i].alt; 
     var myclass = data["items"][i].class; 
     var link = data["items"][i].link; 
    localStorage.setItem("imga", img); 
    localStorage.setItem("alta", alt); 
    localStorage.setItem("linka", link); 
     content += "<a href=\""+link+"\"><img data-src=\"" +img+ "\" alt=\"" +alt+ "\" class=\"" +myclass+ "\"></a>" 
    } 
    $("#owl-demo").html(content); 
    } 


});

儘快插入localStorage元素腳本不再工作（滑塊不出現）...我做錯了什麼？

來源

2013-11-01 LitBe

您收到任何錯誤？ –

你正在測試什麼瀏覽器？你確認你的瀏覽器實際上支持localStorage功能嗎？ – Spudley

其中; s是使用存儲數據的代碼？你的'setItem'代碼存在缺陷...你每次通過'for'循環覆蓋同一個存儲鍵 – charlietfl

本地存儲支持在現代瀏覽器中

如果您在Internet Explorer 7或以下版本中進行測試，則無法正常工作。

檢查HTML5 Web Storage支持的瀏覽器。

我建議在看Modernizr的檢測哪些功能的瀏覽器支持，並採取相應的行動。我過去所做的是在支持的情況下使用localstorage，如果不支持則使用cookie。 Modernizr

UPDATE

$(document).ready(function() { 

$("#owl-demo").owlCarousel({ 
    jsonPath: 'json/customData.json', 
    jsonSuccess: customDataSuccess, 
    lazyLoad: true 
}); 

function customDataSuccess(data) { 
    var content = ""; 
    for (var i in data["items"]) { 

     var img = data["items"][i].img; 
     var alt = data["items"][i].alt; 
     var myclass = data["items"][i].class; 
     var link = data["items"][i].link; 
     localStorage.setItem("imga" + i, img); 
     localStorage.setItem("alta" + i, alt); 
     localStorage.setItem("linka" + i, link); 
     content += "<a href=\"" + link + "?id=" + i + "\"><img data-src=\"" + img + "\" alt=\"" + alt + "\" class=\"" + myclass + "\"></a>" 
    } 
    $("#owl-demo").html(content); 
}

}）;

因此，現在localstorage項目將單獨存在，那麼您需要在新頁面上執行的操作是使用通過URL中的查詢字符串傳遞的id查找localstorage中的項目。

，從查詢字符串獲取ID，然後查找在localStorage的值可以是這樣的新頁面上的功能：

function getLocalStorageItem(id) { 

    var img = localStorage.getItem("imga" + id); 
    var alt = localStorage.getItem("alta" + id); 
    var link = localStorage.getItem("linka" + id);

}

你需要編寫的代碼獲取id參數的查詢字符串值，然後將其傳遞給getLocalStorageItem函數。

顯然，這是一個快速的方法 - 你需要優化此。

來源

2013-11-01 11:36:58 dotnethaggis

這兩種瀏覽器都與本地存儲兼容 – LitBe

也就是說，您應該養成測試瀏覽器是否通過modernizr支持它的習慣。這是很好的做法。 @LitBe – dotnethaggis

@LitBe你有工作嗎？ – dotnethaggis

JavaScript的就是HTML5 LocalStorage攪亂代碼

回答

相關問題