Question

我正在尝试将已从外部json文件填充的localstorage数据保存为＆＃34;收藏夹＆＃34;。具体地，

我在Jquery mobile 1.4.5中有一个listview，当点击每个项目时会创建一个动态页面。现在我希望该页面能够保存为最爱以供以后使用。

到目前为止我的代码：

HTML：

<div data-role="page" id="ccc">
 <div data-role="header">
    <h1>My page</h1> 
</div>  
<div role="main" class="ui-content">
    <ul id="mylist" data-role="listview" data-inset="true">

    </ul>

</div>

JAVASCRIPT：

    $(document).on("pagebeforeshow", "#ccc", function () {    

$.getJSON('https://api.myjson.com/bins/4khhg', function(data) {
        var output="";
        var newpage="";
        for (var i in data.mydata) {
            output+="<li>" + 
            "<a href=\"#page" + data.mydata[i].myId + "\">" + 
            "<h3>" + data.mydata[i].thename + "</h3>" +
            "<p>" + data.mydata[i].desciption + "</p>" + "</a>" +
            "</li>";

            //see if page already exists in DOM
            if ($("#page" + data.mydata[i].myId).length == 0) {
                newpage+="<div data-role=\"page\" id=\"page" + data.mydata[i].myId + "\">";
                newpage+="<div data-role=\"header\">"+
                "<a data-role=\"button\"  data-rel=\"back\" data-icon=\"back\">Back</a>" +"<h3>" +
                data.mydata[i].thename +  "</h3>" + 
"<a data-role=\"button\"  data-icon=\"star\"   class=\"saveit\"  data-saveid=\"" +     data.mydata[i].myId +
                    "\">Save it button</a>" + "</div>";
          newpage+="<div role=\"main\" class=\"ui-content\">" + 
          data.mydata[i].desciption +  "</div> </div>";
            }

        }

      output+="";
      newpage += "";
      $('body').append(newpage);
      $("#mylist").html(output).listview('refresh');
////////////////// start save function ///////////////    
$(".saveit").click(function (){
var saveditems = [];
saveditems[0] = "<h3>  " + data.mydata[i].thename + "</h3>  " +  data.mydata[i].desciption ;
localStorage["saveditems"] = JSON.stringify(saveditems);
var storeditemss = JSON.parse(localStorage["saveditems"]);
    alert(saveditems);

});
////////////////// end save function ///////////////

});
});

A fiddle code is here

我的主要问题是：

该函数被调用，因为它似乎很多次（我有一个警报）as 我们点击三次 - 按钮的四倍＆＃34;保存它＆＃34;。我们的次数越多返回列表，然后重新打开动态页面，更多调用该函数的时间。
主要问题是循环中的当前项目未保存在localstorage中。只有循环的最后一项。

任何帮助或提示？

无法从动态列表Jquery Mobile将JSON数据存储到本地存储

0 个答案: