Jquery的两个api调用在两个嵌套的$中检索不同的动态元素.每一个循环

Jquery two api calls to retrieve different dynamic elements inside two nested $.each loops

本文关键字：两个 动态 每一个 检索 循环 元素 调用 api Jquery 嵌套      更新时间：2023-09-26

我有一个包含顶部元素的api链接。对于每个元素，我需要构建第二个api调用的末尾，该调用将为我提供所需的其余元素并将它们拉出。

假设第一个json是(urlphonebrands)，包含3个手机品牌(Apple, Samsung &诺基亚)。第二个json调用依赖于每个品牌名称，如urlphonebrands/Nokia，或urlphonebrands/Samsung或urlphonebrands/Apple自动构建。

我需要遍历每个品牌名称以获得诸如颜色、电池寿命和尺寸等属性。但每种颜色都有另一个选择循环，例如，黑色，白色，红色。我的最终结果将是，

Apple
    battery life: 
        6h
    color: 
        blue 
        black
Samsung: 
    battery life: 
        6h
    color:
        blue 
        black
Nokia:
    battery life: 
        3h
    color: 
        blue

虽然我能够成功地遍历每个top元素，但我只能检索到第一个项目的最后一个color元素，这表明我错误地构建了第二个循环。我看了几个小时，觉得我需要一些帮助。这是我的，

$.getJSON("urlphonebrands", function(data){
    var brandBlock = data[0]['name'];
    $.each(data, function(index, brandBlock){
        var brand = brandBlock.name;
        $('#table').append('<tr><td>' + brand + '</td></tr>');
        //It works fine until this point
        $.getJSON("phonebrandsurl" + brand, function(data){
            $.each(brand, function (index2, brand){
                var color = data[0].name[0].color;
                $('#table').append('<tr><td>' + color + '</td></tr>');
            });

        });

    });
});

得到的结果是

Apple
    blue
    blue
Samsung
    blue
    blue
Nokia
    blue

这是第二个api调用后的console.log输出，

[Object]
0: Object
brand: Array[17]
0: Object
battery life: "6h"
colors: Object
color: "blue"

尝试将第二个getJSON封装到匿名函数中，并将brand作为参数传递::

(function(brand){
  $.getJSON('phonebrandsurl' + brand, function(data){
  // ...
}(brand))
相关文章：