javascript - JQuery Mobile 列表没有获得正确的样式

Question

我的 html 文件中有一个无序列表

<ul data-role="listview" id="mylist" data-inset="true" data-theme="c" data-dividertheme="a" >

</ul>

列表元素是从js文件中的数据库填充的

$('#mylist').append('<li><a href="#"> <h1 class="myHeader">'+item.name+'</h1><p class="myParagraph">'+item.state+'<br>'+item.zipcode+'</p></a></li>');

这是我在样式表中所做的

.myHeader.ui-li-heading {
    color: #000000;
    font-family: Helvetica;
}

.myParagraph.ui-li-desc {
    color: #333;
    overflow: show;
    text-overflow: clip;
    white-space: normal;
    height: 28px;
    margin-bottom: 0px;
}

问题是列表没有获得正确的样式。我做的完全错了吗？什么是解决方案？

Answer 1

你错过了:

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

这是根据您的代码制作的示例:http://jsfiddle.net/Gajotres/Z6wzQ/

可在此处找到更多信息:http://jquerymobile.com/test/docs/lists/docs-lists.html .查看标题更新列表。