通過JSON陣列的問題

所以我有一個AJAX調用，它返回數組循環：通過JSON陣列的問題

[ 
     { 
     "id":"47", 
     "description":"Or pancakes?", 
     "source":"", 
     "uncut_url":"uploads\/uncut\/IMG_20140221_100557.jpg", 
     "300_url":"uploads\/300\/IMG_20140221_100557.jpg", 
     "600_url":"uploads\/600\/IMG_20140221_100557.jpg", 
     "created":"2014-03-07 15:01:41" 
     }, 
     { 
     "id":"46", 
     "description":"Who doesnt like eggs benedict?", 
     "source":"", 
     "uncut_url":"uploads\/uncut\/2014-02-20 08.40.26.jpg", 
     "300_url":"uploads\/300\/2014-02-20 08.40.26.jpg", 
     "600_url":"uploads\/600\/2014-02-20 08.40.26.jpg", 
     "created":"2014-03-07 15:00:15" 
     } 
    ]

我想將其添加到我打算與$（）做一個div追加（）;

到目前爲止，我有這樣的：

  $.ajax({ 
      type: "POST", 
      url: "get_images.php", 
      data: {offset: img_no}, 
      dataType: "json", 
      success: function(data){ 
       $.each(data, function(index, item){ 

       alert(data); 
       $("#maincontainer").append("<div class='imgcontain'>"); 
       $("#maincontainer").append("<img class='thumb' src='"+data.300_url+"' />"); 
       $("#maincontainer").append("</div>"); 
      });

所以我想通過數組，做一個與陣列中的每個項目的東西循環，但我無法得到它的權利，所以該警報遠遠說「[object，Object]」，並且這樣做了兩次。我確信有一個簡單的解決方案，我只是沒有看到它，任何幫助，非常感謝。

來源

2014-03-12 Alex Bridger

變化來代替data在$.each功能'$（「#maincontainer」）.append（「」）;'爲$（「#maincontainer 「）.append（」「）; – ochi

您也可以使用'$（「#maincontainer」）.append（「」）;' – ochi

如果您想訪問以數字開頭的屬性，則必須使用括號表示法。當然，你必須訪問正確的對象。 –

這是預期行爲的數量。 data是你正在迭代的（這就是爲什麼它顯示了兩次，你的數據中有兩個項目），並且用alert()進行調試不會很有幫助。嘗試把它放在console.log()聲明中。

然而，問題的解決方案是item :)

來源

2014-03-12 23:08:11 Jason

非常感謝您的建議，使用控制檯確實可以讓您更輕鬆。所以我沒有改變任何東西，除了現在我使用console.log（item.id）;的console.log（item.description）;這工作正常，除了當我添加console.log（item.300_url）;然後在該行中引發錯誤「Unexpected token ILLEGAL」，任何想法爲什麼？ –

所以在多次控制檯日誌記錄之後，我發現我可以用item ['id']來引用每個項目。所以雖然我沒有完全使用你的答案，但它肯定會讓我走上正確的軌道，謝謝:) –

很高興我可以幫助！ :) – Jason

append()不像串連接一樣工作。

當你說$("#maincontainer").append("<div class='imgcontain'>") create create和關閉目標div元素，所以img將被創建爲兄弟而不是作爲後代。

此外，您還需要使用item來指代迭代回調中數組中的當前項目。

$.ajax({ 
    type: "POST", 
    url: "get_images.php", 
    data: { 
     offset: img_no 
    }, 
    dataType: "json", 
    success: function (data) { 
     var array = []; 
     $.each(data, function (index, item) { 
      array.push("<div class='imgcontain'>"); 
      //need to use item to refer current item 
      array.push("<img class='thumb' src='" + item.300_url + "' />"); 
      array.push("</div>"); 
     }); 

     $("#maincontainer").append(array.join('')); 
    } 
})

陣列基於溶液用在這裏，因爲它限制DOM操作

來源

2014-03-12 23:07:16

通過JSON陣列的問題

回答

相關問題