json - 从 json 文件更新 JQuery 移动 ListView

Question

在花了最后几天试图找到解决方案之后，现在我寻求帮助以了解我的代码中的哪些是错误。从以下外部 Json 文件开始 listviewJsonData.json

var itemList = [{"title":"Title_1","description":"Blah blah1"},{"title":"Title_2","description":"Blah blah2"}];

我正在通过以下代码更新 ListView :

<div id="dataList">
     <ul data-role="listview" data-inset="true">
        <script type="text/javascript">
            var serviceURL = "https://.../.../listviewJsonData.json";
            var outputitem = '';
            $.getJSON(serviceURL,function(data) {
                $.each(data, function(index,item) {
                        outputitem += '<li><h4>'+ item[index].title +'</h4></li>';
                        $('#dataList').append(outputitem);
                    }
                    $('#dataList').listview('refresh');
            }); 
        </script>
     </ul>
</div>

这段代码没有给我任何更新， ListView 仍然是空的， 我也检查过这个 post但我无法找到解决问题的方法。

有人能帮我吗？ 非常感谢

Answer 1

您的脚本是内联的，可能会在 jQuery Mobile 加载或增强您的标记之前触发。尝试通过将脚本作为 pageinit 事件的一部分来调用它。

http://jquerymobile.com/demos/1.2.0/docs/api/events.html

$( '#aboutPage' ).live( 'pageinit',function(event){
  enhanceMyDataList();
});

此外，您还附加了 <li>元素到容器 <div> ，不是你的 <ul> .移动/合并您的 id属性。

<ul id="dataList" data-role="listview" data-inset="true">