jquery - 在 jquery mobile 中创建动态列表视图不起作用？

Question

当试图动态创建动态列表视图时，我得到了这个

这是我的 json

{"eventid":["61","23"],"name":["Clare Birthday","Mums Birthday"],"enddate":["Sat 27th April 2013","Wed 19th June 2013"]}

这是我的代码。

<script type="text/javascript">
                                $(function(){
                                    var items="";
                                        $.getJSON("ajaxResponder.php?method=check-events",function(data){
                                            $("#contacts").html(
                                            '<li data-role="list-divider" role="heading">Live Events</li>'+
                                                $.each(data,function(index,item){
                                                    '<li><a href="check-events-details?eventid='+item.eventid+'" data-transition="slide">'+item.name+ 
                                                    '<p>End Date: '+item.enddate+'</p></li>'
                                                }));
                                            $("#contacts").listview("refresh");
                                        });
                                });

                        </script>

            <div data-role="fieldcontain">
            <ul id="contacts" data-role="listview" data-divider-theme="b" data-inset="true">
            </ul>
            </div>

谁能看到我哪里出错了？

Answer 1

问题是，您没有正确读取数组。以下解决方案基于您要创建两个带有链接的列表项的假设id。读取数组的方法有很多种，这取决于您希望如何输出数据。

var object = {
 "eventid": ["61", "23"],
 "name": ["Clare Birthday", "Mums Birthday"],
 "enddate": ["Sat 27th April 2013", "Wed 19th June 2013"]
};

首先，您需要将 JSON 对象转换为数组。

var array = [object];

然后在里面循环。我for在这里使用语句循环两次。

for (var i = 0; i < 2; i++) {
 $.each(array, function (index, values) {
  var events = values.eventid;
  var names = values.name;
  var enddates = values.enddate;
  $('[data-role="listview"]').append('<li><a href=link"' + events[i] + '"> ' + names[i] + ' - ' + enddates[i] + '</a></li>');
  $('[data-role="listview"]').listview('refresh');
 });
}

演示

注意：元素id应该以字母而不是数字开头。