JSON格式

[{"name": "Sri Lanka","region":"Asia"}, {"name": "India","region":"Asia"}, {"name": "kenya","region":"Africa"}, {"name": "Zimbabwe","region":"Africa"}]

我想显示如下

  • 非洲
  • 肯尼亚
  • 津巴布韦

  • 亚洲

  • 印度
  • 斯里兰卡

===============>>#1 票数:1 已采纳

尝试

 var data = [{ "name": "Sri Lanka", "region": "Asia" }, { "name": "India", "region": "Asia" }, { "name": "Kenya", "region": "Africa" }, { "name": "Zimbabwe", "region": "Africa" }]; $.each(data, function(key, val) { // if `body` does not already have `ul` having // `class` `region` , append `ul` with first `name` // utilize `b` element as "header" for `ul` , // to render `region` "header" above `ul` `li` `name`s if (!$("body ul." + val.region).is("*")) { $("<ul />", { "class": val.region, "html": "<li>" + val.name + "</li>" }) .appendTo("body") .before("<b class=" + val.region + ">" + val.region + "</b>"); } else { // if `b` `textContent` is `region` , // append remaining `name` to `ul` that follows `b` $("b." + val.region).each(function() { if (this.textContent === val.region) { $(this).next("ul").append("<li>" + val.name + "</li>") } }) } }); 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"> </script> 

===============>>#2 票数:1

假设要按地区名称然后按国家名称排序,请按照以下步骤操作。

首先,将国家/地区阵列转换为对象,其属性是国家/地区阵列。 这个中间步骤比直接转换为区域数组更简单。

var regions = {};
$.each(countries, function(i, obj) {
    if(!regions[obj.region]) {
        regions[obj.region] = [];
    }
    regions[obj.region].push(obj.name);
});

然后,将regions对象转换为regions的排序数组。

var sortedRegions = $.map(regions, function(value, key) {//key is a region name, value is an array of the region's countries
    value.sort(function(a, b) { return a.toUpperCase() > b.toUpperCase(); });//sort the arrays of countries alphabetically
    return {'region': key, 'countries': value};
}).sort(function(a, b) { return a.region.toUpperCase() > b.region.toUpperCase(); });//sort the mapped array of regions alphabetically

然后将sortedRegions转换为所需的HTML。

var html = sortedRegions.reduce(function(html_1, r) {
    return html_1 + r.countries.reduce(function(html_2, c) {
        return html_2 + '<li>' + c + '</li>';
    }, '<li>' + r.region + '</li><li><ul>') + '</ul></li>';
}, '<ul>') + '</ul>';

现在,您可以将HTML推送到DOM中:

$("#myContainer").html(html);

演示

  ask by Manas Ranjan Pradhan translate from so

未解决问题?本站智能推荐:

2回复

使用jQuery从JSON文件中提取数据并将其分成几组

我目前正在绞尽脑汁,让网站的特定部分正常工作。 它包括单击一个按钮并检查其“数据组”属性。 这应该打开另一个div,并用从本地JSON文件提取的内容填充它,我必须根据每个按钮的data-group属性进行过滤。 我当前的JSON如下所示: ] 我的Javascript
2回复

如何使用jQuery JSON从PHP JSON中提取值?

好的,这是我让PHP将一些MySQL信息编码为JSON格式,然后强制jQuery通过位于服务器上的文件来获取的信息。 PHP生成的JSON编码看起来像这样,问题是我不明白如何使用jQuery从JSON数组中提取文件,大小,名称,预览 这是一个示例JSON数组 有人可以帮我从信息中
3回复

从json文件中提取数据以在.query中的。$ post中使用

我想从json文件中提取数据以将其发布到服务器端。 这种数据清理工作: 但是我需要这样的事情: 我知道$ .post将数据作为PlainObject或String获取,但我想以某种方式将数据作为json文件发布,因为我的json文件非常复杂(嵌入的键值对过多),无法使用$
4回复

使用Jquery从JSON格式中提取数据

我有这样的URL,这是一个像这个链接http://www.mysite.com/json.js的js文件示例,该链接将输出一个json格式的值,如下所示: 现在我想抓住那个链接,然后在我的jquery上如何使用json输出的链接以获得标题,网址,价格,sku等值? 我搜索谷歌是否有
2回复

使用jquery从JSON数据中提取并记录值

我进行了搜索,但是不确定如何表达我的查询,我一直无法实现我认为的简单目标。 我有一个通过Yahoo Pipes运行的Deviant Art的RSS feed 这是管道” http://pipes.yahoo.com/pipes/pipe.info?_id=63478be58fb007
5回复

使用jQuery从JSON中提取特定数据

从以下json片段中: 我可以使用jQuery提取Monday ,如下所示: data.query.results.tbody[0].tr[0].td[0].p 如何提取“ Sunny Intervals ?
2回复

如何在jQuery中构建json文件并从中提取数据值?

我有需要建立json文件的Excel工作表。 我已经建立了一个样本文件。 但我无法继续处理该json文件并从中提取数据。
2回复

jquery从json文件中提取键并设置为html表头

我正在尝试使用此代码,但它只输出一个键到表行.. 我做错了什么? DEMO
1回复

使用ajax从外部文件中提取JSON数据

我目前正在手动拉入JSON以测试引导表,但需要能够从外部文件拉入,类似于我在这里所做的事情: 我目前正在手动设置数据并像这样循环遍历: 显然,ajax的先前用法是应用DataTables,因此我需要编写它以仅应用.each()循环,或者将其放入DataTable中。 JSF
1回复

使用jVectorMap和JSON获取悬停时相应的国家/地区的拨号代码

我有一个包含国家/地区的JSON文件及其相应的拨号代码(例如,美国为+1,英国为+44)。 我正在使用jVectorMap在悬停时显示该国家的正确拨号代码 如何做到这一点? 到目前为止,我的代码在下面,但这只是在JSON文件中显示每个国家/地区的第一个拨号代码。 参考: