javascript - jquery mobile，在listview li中动态添加可折叠内容

Question

我有一个空列表视图：

<ul data-role="listview" data-theme="d" id="test">

</ul>

我想动态添加包含可折叠内容的 li 标签，但我不知道如何“刷新”它以便显示可折叠内容？

我试过了：

$(document).on('pageinit', function() {
$('#test').append('<li><a href="#"><div data-role="collapsible" class="member-item" data-theme="a"><h3>title</h3><p>some content</p></div></a><a href="#">test</a></li>');
$('#test').listview("refresh");
});

但这只会刷新 li 部分。

然后我尝试了：

$(document).on('pageinit', function() {
$('#test').append('<li><a href="#"><div data-role="collapsible" class="member-item" data-theme="a"><h3>title</h3><p>some content</p></div></a><a href="#">test</a></li>');
$('#test').listview("refresh");
$('.member-item').collapsible('refresh');
});

但是我只是得到加载图标并且页面没有加载？

Answer 1

看起来我必须触发“创建”然后刷新列表视图：

$('#test').trigger('create');
$('#test').listview("refresh");