HTML5 localStorage按键顺序
我的页面上有一些div,编码为
<div id="1">Click Me to load corresponding dynamicList</div><ul class="dynamicList"></ul><div id="2">Click Me to load corresponding dynamicList</div><ul class="dynamicList"></ul>
<div id="3">Click Me to load corresponding dynamicList</div><ul class="dynamicList"></ul>
<div id="4">Click Me to load corresponding dynamicList</div><ul class="dynamicList"></ul>
<div id="5">Click Me to load corresponding dynamicList</div><ul class="dynamicList"></ul>
现在,单击任何一个div,就会进行AJAX调用,将动态列表返回为:
<li>Some content 1</li><li>Some content 2</li>
<li>Some content 3</li>
我想在第一次AJAX调用之后将上述动态列表存储在localStorage中。所以我写;
var key = $(selectedDiv).attr('id'); var value = str; //str = Returned AJAX response of li's
localStorage.setItem(key, value);
现在,在下一页加载中,我想在DOM的正确位置附加所有dynamicList(所有用户之前单击的那些)(因此,在下次单击期间不会对数据进行AJAX调用)
for (i=0;i<localStorage.length;i++) {
var key = localStorage.key(i);
if(key != null)
{
var value = localStorage.getItem(key);
$("#"+i).next(".dynamicList").empty();
$("#"+i).next(".dynamicList").append(value);
}
}
现在似乎在localStorage的顺序中出现了一些问题,因为正确的dynamicList没有被附加在正确的位置。我想这条线有问题
var key = localStorage.key(i);
请让我知道如何解决此问题。
回答:
不要依赖localStorage
键的顺序。您可以通过在所有可用的键重复localStorage
使用localStorage[n]
,而是指可以使用一个密钥(字符串)localStorage[str_key]
或localStorage.getItem(str_key)
。
在您的情况下,您已经将localStorage
键名的索引与您分配给该项的名称混淆了。因此,不要使用键索引,而要使用值键:
for (i=0;i<localStorage.length;i++) {
var key = localStorage.key(i);
if(key != null)
{
var value = localStorage.getItem(key);
$("#"+key).next(".dynamicList").empty();
$("#"+key).next(".dynamicList").append(value);
}
}
以上是 HTML5 localStorage按键顺序 的全部内容, 来源链接: utcz.com/qa/424949.html