无法将列表项添加到jQuery手机中的列表视图

我的JavaScript有什么问题？我已经按照Q & A的说法将数据附加到jQuery移动列表视图，但这似乎不起作用。无法将列表项添加到jQuery手机中的列表视图

<!-- start view_skus --> 
<div data-role="page" id="view_skus"> 
    <div data-role="header" data-position="fixed"> 
     <a data-role="button" data-rel="back" data-icon="arrow-l">Back</a> 
     <h1>View SKUs</h1> 
     <ul data-role="listview" id="sku_list" data-inset="true"></ul> 
     <script type="text/javascript"> 
     var xhr = new XMLHttpRequest(); 
     xhr.open("GET", "http://matkiros.cloudant.com/sm/_design/view_skus/_view/view_skus"); 
     xhr.onload = function() { 
      var response = jQuery.parseJSON(xhr.responseText); 
      for (var i = 0; i < response.total_rows; i++) { 
       $('#sku_list').append($("<li></li>").html('<h3>' + 
        rows[i].value.description + '</h3><br/>' + 
        'ID: ' + rows[i].value.sku_id + '<br/>' + 
        'Quantity: ' + rows[i].value.quantity)) 
        .listview('refresh'); 
      } 
     }; 
     xhr.send(); 
     </script> 
    </div> 
</div> <!-- end view_skus -->

基本上，SKU只是在一家杂货店的产物，我想在一个列表视图中显示其详细信息。

{"total_rows":3,"offset":0,"rows":[ 
{"id":"96ba7296fb95fb14e54a2ae9777dee06","key":"00001","value":{"_id":"96ba7296fb95fb14e54a2ae9777dee06","_rev":"1-029baa64356c5187610d9867c590921b","type":"sku","sku_id":"00001","description":"Dried mangoes","quantity":100}}, 
{"id":"7e1ec756e85f0e073ed98f3e8a59ebb8","key":"53911","value":{"_id":"7e1ec756e85f0e073ed98f3e8a59ebb8","_rev":"1-5e02bd021232b3bc3bd56dd00d50b64d","type":"sku","sku_id":"53911","description":"Samsung Galaxy S II","quantity":35}}, 
{"id":"e5b24f49ac538e5187e382a341ac043c","key":"A91J7","value":{"_id":"e5b24f49ac538e5187e382a341ac043c","_rev":"3-f3bab0f8936023c4133f47b29e78c575","type":"sku","sku_id":"A91J7","description":"Jansport bag J2203-1","quantity":50}} 
]}

来源

2011-09-16 Matt Quiros

我意识到我上面的代码是正确的，但研究所说是rows[i].value.some_property，应该是response.rows[i].value.some_property。

来源

2011-09-22 03:33:25

请JQM beta测试的这

for (var i = 0; i < response.total_rows; i++) { 
    $('#sku_list').append($("<li></li>").html('<h3>' + 
     rows[i].value.description + '</h3><br/>' + 
     'ID: ' + rows[i].value.sku_id + '<br/>' + 
     'Quantity: ' + rows[i].value.quantity)) 
    .listview('refresh'); 
}

相反：我从CouchDB的数据库中的URL http://matkiros.cloudant.com/sm/_design/view_skus/_view/view_skus返回以下JSON字符串检索的SKU列表试试这个

for (var i = 0; i < response.total_rows; i++) { 
    $('#sku_list').append($("<li></li>").html('<h3>' + 
     rows[i].value.description + '</h3><br/>' + 
     'ID: ' + rows[i].value.sku_id + '<br/>' + 
     'Quantity: ' + rows[i].value.quantity)); 
} 

// Make the refresh after the for loop 
$('#sku_list').listview('refresh'); 

// This might be another way but refreshes the whole page 
// $('#view_skus').trigger('create');

来源

2011-09-16 13:36:05

无法将列表项添加到jQuery手机中的列表视图

回答

相关问题