如何使用 Jquery 在 Ajax 数据响应中循环遍历数组？

Question

我希望能够遍历以下 Json 的 image_id 元素：

{status: "ok", data: {…}}
data:
GalleryImage: Array(19)
0: {image_id: "I00008aYI9cCxw4s", gallery_id: "G0000g92exnUn86c"}
1: {image_id: "I0000MuaQtl0LMwc", gallery_id: "G0000g92exnUn86c"}
2: {image_id: "I0000CvKiwaHj9Rg", gallery_id: "G0000g92exnUn86c"}
3: {image_id: "I0000tyBV3PjPkbc", gallery_id: "G0000g92exnUn86c"}
4: {image_id: "I0000CpgUirvZ05Y", gallery_id: "G0000g92exnUn86c"}
5: {image_id: "I00007piqCJCoYCI", gallery_id: "G0000g92exnUn86c"}
6: {image_id: "I0000igOoazcZnzs", gallery_id: "G0000g92exnUn86c"}
7: {image_id: "I0000pClIDfC0IW8", gallery_id: "G0000g92exnUn86c"}
8: {image_id: "I0000oFFxyzDq19k", gallery_id: "G0000g92exnUn86c"}
9: {image_id: "I0000nnPEBbLY2w0", gallery_id: "G0000g92exnUn86c"}
10: {image_id: "I0000nNyL.wjbrlg", gallery_id: "G0000g92exnUn86c"}
11: {image_id: "I0000usbcSdKvtZ8", gallery_id: "G0000g92exnUn86c"}
12: {image_id: "I0000BoONixLgM6w", gallery_id: "G0000g92exnUn86c"}
13: {image_id: "I0000EXj2yigWGAs", gallery_id: "G0000g92exnUn86c"}
14: {image_id: "I0000OWfrVd8XWaw", gallery_id: "G0000g92exnUn86c"}
15: {image_id: "I0000lT3LrDZNC5c", gallery_id: "G0000g92exnUn86c"}
16: {image_id: "I0000VDoQ4n_geaU", gallery_id: "G0000g92exnUn86c"}
17: {image_id: "I0000P57enz5_LkY", gallery_id: "G0000g92exnUn86c"}
18: {image_id: "I0000LEg5hLefuAM", gallery_id: "G0000g92exnUn86c"}
length: 19
__proto__: Array(0)
Paging: {page: 1, first: "https://www.photoshelter.com/psapi/v3/gallery/G0000g92exnUn86c/images?api_key=lcibjNnEoV4", last: "https://www.photoshelter.com/psapi/v3/gallery/G0000g92exnUn86c/images?api_key=lcibjNnEoV4"}
Total: 19
__proto__: Object
status: "ok"
__proto__: Object

我尝试按以下方式进行操作，但我不知道如何通过画廊的元素进行 go。 它是数据 object 中的一个数组

    $.ajax({
        type: 'GET',
        url: url,
        contentType: JSON,
        processData: false,
        success: function (data) {
            console.log(data);
            var row = "";
            $.each(data, function (index, item) {            
                row += "";
                row += "";
                row += "";
            });
            //Data stamp
            $("#images").html(row);
        },
        error: function () {
            //alert("Error en la carga de Imágenes");
        },
    });

请帮忙

Answer 1

重构你的成功方法，如下所示：

success: function (response) {
  var row = "";
  $.each(response.data.GalleryImage, function (index, item) {            
     row += item.image_id";
  });
  //Data stamp
  $("#images").html(row);
},

Answer 2

您需要遍历data.GalleryImage 。 这是 ajax 响应的基本示例

 let data = { GalleryImage: [{ image_id: "I00008aYI9cCxw4s", gallery_id: "G0000g92exnUn86c" }, { image_id: "I0000MuaQtl0LMwc", gallery_id: "G0000g92exnUn86c" }, { image_id: "I0000CvKiwaHj9Rg", gallery_id: "G0000g92exnUn86c" }, { image_id: "I0000tyBV3PjPkbc", gallery_id: "G0000g92exnUn86c" } ] } let row = ''; $.each(data.GalleryImage, function(index, item) { row += item.gallery_id }); $("#images").html(row);

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div id="images"></div>

Answer 3

根据响应，您需要像这样访问GalleryImage ：

$.each(data.data.GalleryImage, function (index, item) {            
  row += "";
  row += "";
  row += "";
});