如何使用jquery mobile向动态创建的列表视图添加更多细节?

时间:2013-04-18 13:24:34

标签: jquery html html5 jquery-mobile jquery-mobile-listview

我如何将href和listview标题添加到下面的代码中。如果我在html部分添加它我不会得到列表

  <script type="text/javascript">
                            $(document).on("pagebeforeshow", "#index1", function() {
                                $(function(){
                                    var items="";
                                    $.getJSON("check-events.php",function(data){
                                    $.each(data,function(index,item) 
                                    {
                                    items+="<li>"+item.enddate+"</li>";
                                     });
                                    $("#contacts").html(items); 
                                    $("#contacts").listview("refresh");
                                    });
                                });
                            });  
                        </script>

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

            </ul>
            </div>

我把这个放在哪里

<li data-role="list-divider" role="heading">
                List view
            </li>

1 个答案:

答案 0 :(得分:5)

让您的HTML代码如下所示:

<ul id="contacts" data-role="listview" data-divider-theme="b" data-inset="true">
    <li data-role="list-divider" role="heading">
        List view
    </li>                           
</ul>

而不是这个jQuery行:

$("#contacts").html(items);

使用这个:

$("#contacts").append(items);

这样,在您开始填充标题之前,标题将位于列表视图中,并且追加函数将在列表视图中添加新内容而不删除之前的内容。