Question

我认为这有一个简单的解决方案。

我有一个列表，我想进入列表视图。东西是动态添加的。

HTML：

<div data-role="content" data-theme="b" class="content-primary">
    <div id="friends_list_view" class="content-primary" data-theme="c"> 
        <ul data-role="listview" data-filter="true" data-theme="c">
        </ul>
    </div>  
</div>

jQuery的：

for(i in names){
      listString =  '<li><a href="#">'+i+'</a></li>';
      $("#friends_list_view ul").append(listString);
}

$("#friends_list_view ul").listview('refresh');
$.mobile.hidePageLoadingMsg();
$.mobile.changePage( "#friends", { transition: "slide"} );

我明白了：

Uncaught在初始化之前无法调用listview上的方法; 试图调用方法'刷新'

当我将其更改为$("#friends_list_view ul").listview();时，我得到：

未捕获的TypeError：无法读取属性'jQuery16409763167318888009' 未定义的

Answer 1

列表视图的页面可能未初始化。试着先调用它：

$('#pageWithListview').page();

Answer 2

jQM PageInit（）文档：

http://jquerymobile.com/test/docs/api/events.html

pageinit
在初始化页面上触发，初始化后发生。我们建议绑定到此事件而不是 DOM ready（）因为无论页面是否适用，这都可以直接加载或如果内容作为一部分被拉入另一个页面 Ajax导航系统。

试试这个：

http://jsfiddle.net/GVCHF/

JS

$( '#home' ).live( 'pageinit',function(event){
    var names = ['Bob','Bill','Phill','Will'];
    var listString = '';
    for(i in names) {
          listString +=  '<li><a href="#">'+i+'</a></li>';
    }
    $("#friends_list_view ul").append(listString);

    $("#friends_list_view ul").listview('refresh');
    $.mobile.hidePageLoadingMsg();
    $.mobile.changePage( "#friends", { transition: "slide"} );
});

HTML

<div data-role="page" id="home">
    <div data-role="content" data-theme="b" class="content-primary">
        <div id="friends_list_view" class="content-primary" data-theme="c"> 
            <ul data-role="listview" data-filter="true" data-theme="c">
            </ul>
        </div>  
    </div>
</div>

jQuery Mobile List View：初始化错误

2 个答案: