javascript - ScrollView 不适用于 jQMobile 中的动态 ListView

Question

这个问题已经有答案了:

Using iScroll with JQM and dynamic content (1 个回答)

已关闭 8 年前。

我在 Cordova 的 jquery mobile 1.4 中有一个动态 ListView ，我正在使用 iscrollview。如果 ListView 不是动态的，那么滚动就可以正常工作。然而，对于动态它不起作用。我创建了一个jsfiddle ;

$(document).on('pagebeforeshow', '#index', function(){ 
    var htmls = '<ul data-role="listview">';
    for(i = 0; i < 30; i++) {
        htmls +='<li><a href="#">Some link</a></li>';
    }
     htmls +='</ul>';
     $(".example-wrapper").append(htmls);
     $("ul", $('#index')).listview();
    $(".example-wrapper").iscrollview("refresh");
});

请注意， ListView 不存在于 DOM 中(在 html 中)。所以这意味着它是动态构建的。

Answer 1

我认为这不起作用，因为当您将 html 附加到 example-wrapper 时，iScroll 已经生成了其内部滚动元素。所以试试这个:

$(document).on('pagebeforeshow', '#index', function(){ 
    var htmls = '<ul data-role="listview">';
    for(i = 0; i < 30; i++) {
        htmls +='<li><a href="#">Some link</a></li>';
    }
     htmls +='</ul>';
     $(".example-wrapper .iscroll-content").append(htmls);
     $("ul", $('#index')).listview();
    $(".example-wrapper").iscrollview("refresh");
});

我 fork 了你的 Fiddle here