java - 如何将特定数据从 JSON 文件解析为 html 下拉菜单

标签 java html css json

JSON FILE

您好,在我上面显示的 json 文件中有超过 30 个比赛日,我想知道如何将数据从 JSON 文件解析为 html 文件,并在下拉菜单中提供选项以便能够按比赛日过滤或按团队过滤,是否可以这样做,或者我想多了,我有文件解析数据并将 json 文件中的所有结果显示到一个表中,如下所示 html file showing all matchdays

我想知道有没有一种方法可以按特定球队或比赛日过滤这些结果?任何帮助表示感谢

html file taking in the json data

最佳答案

下面的代码片段将帮助您完成工作。

var json = '{"name":"EnglishPremierLeague2015","rounds":[{"name":"Matchday1:","matches":[{"date":"2015-08-08","team1":{"key":"manutd","name":"ManchesterUnite","code":"MUN"},"team2":{"key":"tottenham","name":"TottenhamHotspu","code":"TOT"},"scorer":1,"score2":0}]},{"name":"Matchday2:","matches":[{"date":"2015-08-09","team1":{"key":"India","name":"IndianCricketTeam","code":"IND"},"team2":{"key":"England","name":"EnglandCricketTeam","code":"ENG"},"scorer":1,"score2":0}]}]}';

var data = JSON.parse(json);

// Filter by Match Day
var filter = $(data.rounds).filter(function () { 
    return this.name == "Matchday1:";
})

// Test Case :)
if (filter.length == 1) {
    console.log("Filter working")
}

var filterbyTeam = $(data.rounds).filter(function () {
    return this.matches.filter(function (e) {
        return e.team1.key == "India" || e.team2.key == "India";
    }).length >= 1;
})

// Test Case :)
if (filterbyTeam.length == 1) {
    console.log("Filter working")
}

此代码将获取带有过滤器的 JSON 数组,您可以进一步使用该过滤器来显示您的 HTML。

注意:您需要根据您的要求传递过滤器文本。您也可以更改属性以过滤特定数据。

希望这会有所帮助:)

关于java - 如何将特定数据从 JSON 文件解析为 html 下拉菜单,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53127151/

相关文章:

java - 抽屉导航中的 LinearLayout

java - 检测 html 元素更改的最佳方法?

HTML/CSS - 跨越整个标题的 Logo 链接

css - bootstrap 3 中附加导航栏的奇怪行为

javascript - Google Chrome 28.0 全屏 API - 不尊重 CSS 'width:100%'

javascript - 简单的 jQuery 分页

Java libgdx 匀速方向发射子弹

java - 用于 Java 应用程序的 Python Web 服务?

jquery - 模态对话框 Jquery 不适用于 Chrome 和 Internet Explorer

jquery - 在 css 中覆盖系统样式外观在 asp.net 中不起作用