带有缩略图的 JQueryMobile 列表视图仅显示一些图片

Question

我正在开发一个简单的应用程序，以测试 jQuery Mobile + PhoneGap 框架。 我的元素中有一些缩略图的列表视图有问题。

问题是某些图片的大小和渲染正确，而其他图片则没有。 我不明白为什么：如果我从浏览器导航到它们，链接是正确的。 此外，如果我将相同的链接放在列表视图之外，比如说在 div 元素中，图像会正确渲染（并且显然没有调整大小）。

这快把我逼疯了！

代码sn-ps为（相关HTML和相关JS）：

HTML

<div data-role="content">
   <ul id="docList" data-role="listview">
   </ul>
</div>

JS

for(var i=0; i<docs.length; i++)
{
    var toSet = '<li><a href="#"><img class="myListImg" src='+docs[i].field_obj_image_fid+'/><h3>'+docs[i].title+'</h3><p>'+docs[i].field_obj_image_fid+'</p></a></li>';
    $("#docList").append(toSet);
}
$("#docList").listview('refresh');

感谢您的帮助， 里克

Answer 1

$("PAGE_ID div:jqmData(role=content) ul #docList").empty();

for(var i=0; i'+docs[i].title+'

'+docs[i].field_obj_image_fid+'

';

}

$("PAGE_ID div:jqmData(role=content) ul #docList").append (toSet);

$("#docList").listview('refresh');