如何在列表視圖中顯示json數據？

我想使用json調用來檢索php頁面中的數據，並使用jquery mobile在listview中顯示它。我能夠檢索數據，並能夠顯示在列表中，但我面臨的問題是：我的數據流這樣在php文件中：（[{「id」：「1」，「name」：「Big Ben「，」latitude「：」51.500600000000「，」longitude「：」 - 0.124610000000「}，{」id「：」4「，」name「：」Hadrian's Wall「，」緯度「：」55.024453000000「：「2.142310000000」}，{ 「ID」：「2」，「名稱」：「巨石」，「緯度」：「51.178850000000」，「經度」：「 - 1.826446000000」}，{ 「ID」：「3」，「名稱」：「多佛白崖」，「緯度」：「51.132020000000」，「經度」：「1.334070000000」}]）;如何在列表視圖中顯示json數據？

當我在列表中顯示它時，它只顯示在列表的一行中。我怎樣才能將數據顯示在與他們的「id」相關的獨立行中？

來源

2012-11-22 Fabre

var i; 

for(i = 0; i < data.length; i+=1) { 
    // do whatever here, the id is in data[i].id 
    console.log(data[i].id); 
}

既然你提到你正在使用jQuery移動，也許你會追加<li>元素列表視圖，在這種情況下，你會使用你的<ul data-role=listview>的.append方法。

編輯：根據你的評論，你的每個函數改成這樣：

$.each(data, function(i, item) { 
    $('ul').append('<li><h1>' + item.name + '</h1><p>' + item.latitude + '<br>' + item.longitude + '</p></li>'); 
});

而且從HTML代碼中刪除<li><a id="output"> </a></li>。

但是，如果頁面上有多個<ul>元素，它將不起作用，因此建議在正確的<ul>元素上設置id。

來源

2012-11-22 08:43:37

以上我發佈了我的代碼.. plz請參閱 – Fabre

我應該在哪裏提及此代碼？ – Fabre

你正在使用'.each'，所以我真的不知道這是什麼問題... –

$(document).ready(function(){ 
$(document).bind('deviceready', function(){ 
    //Phonegap ready 
    onDeviceReady(); 
}); 

var output = $('#output'); 

$.ajax({ 
    url: 'http://samcroft.co.uk/demos/updated-load-data-into-phonegap/landmarks.php', 
    dataType: 'jsonp', 
    jsonp: 'jsoncallback', 
    timeout: 5000, 
    success: function(data, status){ 
     $.each(data, function(i,item){ 
      var landmark = '<h1>'+item.name+'</h1>' 
      + '<p>'+item.latitude+'<br>' 
      + item.longitude+'</p>'; 

      output.append(landmark); 
     }); 
    }, 
    error: function(){ 
     output.text('There was an error loading the data.'); 
    } 
});

}）;

來源

2012-11-22 08:47:40 Fabre

如何在列表視圖中顯示json數據？

回答

相關問題