我有这段代码块,将我的数组中的“类别”显示到JQuery简单列表中。
效果很好,但是如果“篮球”类别中有3个项目,该类别将出现3次。
我怎样才能使它们只出现一次?谢谢。
这是代码:
function loadCategories() { console.debug('About to refresh with sort type : ' + sortType); var items = []; $.each(catalog.products, function(index, value) { items.push('<li id="' + index + '">' + '<a data-identity="productId" href="./productList.page?category=' + value.category + '" >' + '<p style="margin-bottom:0px;margin-top:0px;">' + value.category + '</p></a> </li>'); } ); categoryView.html(items.join('')); categoryView.listview('refresh'); }
这是我的数组的代码:
var catalog = {"products": [ {"id": "10001", "name": "Mountain bike", "color": "Grey/Black", "long-desc": "12-speed, carbon mountain bike.", "description": "", "size": "20 inches", "category": "Outdoors/ Equipment rental", "sport": "Cycling", "brand": "DaVinci", "top-seller": ""}, {"id": "10002", "name": "Pro Multi Basketball", "color": "Rainbow", "long-desc": "On sale this week only! This limited edition basketball is multi-coloured, and offers pro performance. Fun and games on the court!", "description": "Limited edition basketball.", "size": "N/A", "category": "Team gear", "sport": "Basketball", "brand": "Nike", "top-seller": "x"},
我不知道您的products数组是如何构建的(因此我的示例可能需要根据您的需要进行一些修改),但是您可以编写一些代码,首先将您的独特类别收集到一个新数组中:
products
var categories = []; $.each(catalog.products, function(index, value) { if ($.inArray(value.category, categories) === -1) { categories.push(value.category); } });
jsFiddle演示
categories将包含您需要的唯一类别,您可以使用它来构建HTML(li尽管要小心那些元素的ID ,请记住ID不能重复,您可以给它们加上一些前缀)。
categories
li