jquery - How do I dynamically add items to a listview in jQuery Mobile / Listview not updating

Question

Take a look at my code: http://jsfiddle.net/WqssQ/

When you click check in, it pops up with a listview in a dialog page. If you dismiss this, then click check in again, the listview isn't formatted properly.

I have tried:

$('#location_listview').listview('refresh');

As suggested, but this doesn't work.

Answer 1

在刷新列表视图之前，您必须等到它的初始化。试试这个：

$( "#location_popup" ).one( "pagebeforeshow", function( event ) {
        $('#location_listview').listview('refresh');
});

演示在这里。

Answer 2

我认为你必须把它放在lihtml 代码中，而不是用 jquery 附加它。看看这个新小提琴：http: //jsfiddle.net/lulu3030/WqssQ/1/

Answer 3

 $.mobile.changePage("#location_popup", {
    transition: "fade",
    role: "dialog",
    reverse: false
});

$('#location_listview').listview('refresh'); // location_listview 的定位解决了这个问题

检查我在 jsfiddle 上的解决方案。http://jsfiddle.net/WqssQ/20/

$('#get_places').click(function () {
    onSuccess();
});

function onSuccess() {

    $('#location_listview').html("");



    for (var i = 0; i < 7; i++) {
        $('#location_listview').append("<li><a href=#main>" + i + "</a></li>");
    }


    $.mobile.changePage("#location_popup", {
        transition: "fade",
        role: "dialog",
        reverse: false
    });

 **$('#location_listview').listview('refresh');**

}