Question

我正在利用jquery循环搜索＆＃39; searchResults＆＃39;并通过“搜索结果”来循环播放然后再循环到＆＃39; SearchResultItems＆＃39;开始附加值。然后我找到了＃LocationDetails＆＃39;并通过嵌套的State值循环显示每个＆＃39; DisplayTitle的状态。

如果该描述编写得不好，这里是代码。

searchResults = [{
  "SearchResult": {
    "SearchResultItems": [{
        "MatchedObjectDescriptor": {
        "URI":"http://...",
        "DisplayTitle": "Boss Person",
        "LocationDetails": [{
            "State": "California",
          "CityName": "San Francisco County, California",
        },{
          "State": "Colorado",
          "LocationName": "Denver, Colorado",
        },{
            "State": "California",
          "CityName": "Los Angeles, California",      
        }]
      }
    },{
        "MatchedObjectDescriptor": {
        "URI":"http://...",
        "DisplayTitle": "Assistant",
        "LocationDetails": [{
            "State": "Colorado",
          "CityName": "Denver, Colorado",
        },{
          "State": "Colorado",
          "LocationName": "Denver, Colorado",
        },{
            "State": "California",
          "CityName": "Sacramento, California",      
        }]
      }    
        },
    ]
   }
}];

我目前尝试导航对象数组。

$.each(searchResults, function(key,value){
    $.each(value.SearchResult.SearchResultItems,function(key,value){
        var items = value.MatchedObjectDescriptor,
            title = items.DisplayTitle;
        $.each(items.LocationDetails, function(key,value){
            var states = value.State;
            $(".content").append("<ul><li>'" + title + "'<ul><li>'" + states + "'</li></ul></li></ul>");
        });
    });
});

到目前为止，请查看我的工作，输出错误：https://jsfiddle.net/arkjoseph/esvgcos7/15/

我正在寻找此输出过滤重复状态，并且对象中可用的每个状态都没有不同的标题。

老板的人
- 加利福尼亚
- 科罗拉多
助理
- 科罗拉多
- 加利福尼亚

Answer 1

这为您提供了预期的输出。

searchResults = [{
  "SearchResult": {
    "SearchResultItems": [{
      "MatchedObjectDescriptor": {
        "URI": "http://...",
        "DisplayTitle": "Boss Person",
        "LocationDetails": [{
          "State": "California",
          "CityName": "San Francisco County, California",
        }, {
          "State": "Colorado",
          "LocationName": "Denver, Colorado",
        }, {
          "State": "California",
          "CityName": "Los Angeles, California",
        }]
      }
    }, {
      "MatchedObjectDescriptor": {
        "URI": "http://...",
        "DisplayTitle": "Assistant",
        "LocationDetails": [{
          "State": "Colorado",
          "CityName": "Denver, Colorado",
        }, {
          "State": "Colorado",
          "LocationName": "Denver, Colorado",
        }, {
          "State": "California",
          "CityName": "Sacramento, California",
        }]
      }
    }, ]
  }
}];

var states = "";
$.each(searchResults, function(key, value) {
  $.each(value.SearchResult.SearchResultItems, function(key, value) {
    var items = value.MatchedObjectDescriptor,
      title = items.DisplayTitle;
    var s = [];
    var li = "";
    $.each(items.LocationDetails, function(key, value) {
      var states = value.State;
      if (!s.includes(states)) {
        s.push(states);
        li += ("<li>" + states + "</li>")
      }
    });
    $(".content").append("<ul><li>" + title + "<ul>" + li + "</ul></li></ul>");
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<div class="content"></div>




actual json endpoint: <a target="_blank" href="https://pastebin.com/embed_js/dRfMedYb">Here</a>

Answer 2

您的代码的工作版本如下。这只是如何做到这一点的一个例子，但是在ES6中使用Set（如果你有一个允许或正在使用像Babel这样的转换器的环境）可能是可取的。无论哪种方式，这只是附加到一个数组并在末尾连接一个空字符串来创建您的节点。使用jQuery来构建你的元素也可能会更具可扩展性，但对于一个小应用程序，以下工作。

searchResults = [{
  "SearchResult": {
    "SearchResultItems": [{
        "MatchedObjectDescriptor": {
        "URI":"http://...",
        "DisplayTitle": "Boss Person",
        "LocationDetails": [{
            "State": "California",
          "CityName": "San Francisco County, California",
        },{
          "State": "Colorado",
          "LocationName": "Denver, Colorado",
        },{
            "State": "California",
          "CityName": "Los Angeles, California",      
        }]
      }
    },{
        "MatchedObjectDescriptor": {
        "URI":"http://...",
        "DisplayTitle": "Assistant",
        "LocationDetails": [{
            "State": "Colorado",
          "CityName": "Denver, Colorado",
        },{
          "State": "Colorado",
          "LocationName": "Denver, Colorado",
        },{
            "State": "California",
          "CityName": "Sacramento, California",      
        }]
      }    
        },
    ]
   }
}];

var states = [];
var output = [];
$.each(searchResults, function(key,value){
    output.push("<ul>")
    $.each(value.SearchResult.SearchResultItems,function(key,value){
    var items = value.MatchedObjectDescriptor,
            title = items.DisplayTitle;
        output.push("<li>" + title + "</li>")
        output.push("<ul>")
        $.each(items.LocationDetails, function(key,value){
            if (states.filter(s => s == value.State).length) return;
          states.push(value.State)
          output.push("<li>" + value.State + "</li>")
        });
        states = []
        output.push("</ul>")
  });
  output.push('</ul>')
});
$(".content").append(output.join(''));

嵌套对象数组值

2 个答案: