循环遍历对象,仅重复显示一次

时间:2017-11-09 07:36:09

标签: javascript jquery json ajax rest

 var fixtures = [
        {
          "matchday": 1,
            "homeTeamName": "Arsenal FC",
            "awayTeamName": "Leicester City FC"
          },
           {
          "matchday": 1,
              "homeTeamName": "AFC Bournemouth",
              "awayTeamName": "Watford FC",
          },
            {


            "matchday": 1,
                "homeTeamName": "Burnley FC",
                  "awayTeamName": "West Bromwich Albion FC",
              },
               {
              "matchday": 1,
                "homeTeamName": "Leicester City FC",
                  "awayTeamName": "Brighton & Hove Albion",
              },
             {
               "matchday": 2,
                  "homeTeamName": "Liverpool FC",
                  "awayTeamName": "Crystal Palace FC",
              },
               {
               "matchday": 2,
                  "homeTeamName": "Stoke City FC",
                  "awayTeamName": "Arsenal FC",
              },

            ];

我有这个代码,我希望在相邻的行中显示所有具有相同比赛日的球队,这意味着比赛日将在第一行显示,然后是当天比赛的球队。

enter image description here

我试过这个

var x = '';

for(var key in fixtures){
                x += '<tr><th colspan="2">Match Day: ' + fixtures[key].matchday + '</th></tr>'+
                '<tr><td>' + fixtures[key].homeTeamName + '</td>' + 
                '<td>' + fixtures[key].awayTeamName + '<td></tr>';

            }


$("#test").html(x);

但获得了this

2 个答案:

答案 0 :(得分:1)

你可以这样做,这只会是一个新的“匹配日”。

var mday = 0;
for (var key in fixtures) {
  if (mday != fixtures[key].matchday) {
    mday = fixtures[key].matchday
    x += '<tr><th colspan="2">Match Day: ' + fixtures[key].matchday + '</th></tr>';
  }

  x += '<tr><td>' + fixtures[key].homeTeamName + '</td>' +
    '<td>' + fixtures[key].awayTeamName + '<td></tr>';

}

<强>演示

var fixtures = [{
    "matchday": 1,
    "homeTeamName": "Arsenal FC",
    "awayTeamName": "Leicester City FC"
  },
  {
    "matchday": 1,
    "homeTeamName": "AFC Bournemouth",
    "awayTeamName": "Watford FC",
  },
  {


    "matchday": 1,
    "homeTeamName": "Burnley FC",
    "awayTeamName": "West Bromwich Albion FC",
  },
  {
    "matchday": 1,
    "homeTeamName": "Leicester City FC",
    "awayTeamName": "Brighton & Hove Albion",
  },
  {
    "matchday": 2,
    "homeTeamName": "Liverpool FC",
    "awayTeamName": "Crystal Palace FC",
  },
  {
    "matchday": 2,
    "homeTeamName": "Stoke City FC",
    "awayTeamName": "Arsenal FC",
  },

];

var x = '';
var mday = 0;

for (var key in fixtures) {
  if (mday != fixtures[key].matchday) {
    mday = fixtures[key].matchday
    x += '<tr><th colspan="2">Match Day: ' + fixtures[key].matchday + '</th></tr>';
  }

  x += '<tr><td>' + fixtures[key].homeTeamName + '</td>' +
    '<td>' + fixtures[key].awayTeamName + '<td></tr>';

}


$("#test").html(x);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="test"></table>

答案 1 :(得分:0)

如果您的数组按比赛日排序(必须进行排序),您可能会记住上一个项目的比赛日并将其与当前项目进行比较。一旦它与众不同 - 您将为前一部分添加结束标记并开始新标记。