-2

我有这个页面，您可以在底部单击不同的类别来解析适用公司的徽标。数组中的最后一项（“Wesco”徽标）应该只出现在“分发”类别中，但会出现在几个类别中。json 文件内容如下：

{"customers": [
        {"customerName": "3M", "imageLink": "/images/client-logos/logo-3m.jpg", "category": "healthcare,manufacturing","link":"http://www.3m.com"},
        {"customerName": "Acxiom", "imageLink": "/images/client-logos/logo-acxiom.jpg", "category": "info-tech,services","link":"http://www.acxiom.com"},
        {"customerName": "Adobe", "imageLink": "/images/client-logos/logo-adobe.jpg", "category": "info-tech","link":"http://www.adobe.com"},
        {"customerName": "Alcatel-lucent", "imageLink": "/images/client-logos/logo-alcatel.jpg", "category": "telecommunications,info-tech","link":"http://www.alcatel-lucent.com"},
        {"customerName": "Amdocs", "imageLink": "/images/client-logos/logo-amdocs.jpg", "category": "info-tech,services","link":"http://www.amdocs.com"},
        {"customerName": "Arris", "imageLink": "/images/client-logos/logo-arris.jpg", "category": "info-tech,manufacturing","link":"http://www.arrisi.com"},
        {"customerName": "Aspect", "imageLink": "/images/client-logos/logo-aspect.jpg", "category": "info-tech","link":"http://www.aspect.com"},
        {"customerName": "Berylhealth", "imageLink": "/images/client-logos/logo-beryl.jpg", "category": "healthcare","link":"http://www.berylhealth.com"},
        {"customerName": "Bisys", "imageLink": "/images/client-logos/logo-bisys.jpg", "category": "info-tech","link":"www.citibank.com"},
        {"customerName": "Broadview Networks", "imageLink": "/images/client-logos/logo-broadview.jpg", "category": "telecommunications","link":"http://www.broadviewnet.com"},
        {"customerName": "Butler Schein", "imageLink": "/images/client-logos/logo-butler.jpg", "category": "info-tech,healthcare,distribution","link":"http://www.butlerschein.com"},
        {"customerName": "Carlton-Bates", "imageLink": "/images/client-logos/logo-cbc.jpg", "category": "info-tech,distribution","link":"https://www.carltonbates.com"},
        {"customerName": "Cisco", "imageLink": "/images/client-logos/logo-cisco.jpg", "category": "info-tech,manufacturing","link":"http://www.cisco.com"},
        {"customerName": "Citrix", "imageLink": "/images/client-logos/logo-citrix.jpg", "category": "info-tech","link":"http://www.citrix.com"},
        {"customerName": "Comverse", "imageLink": "/images/client-logos/logo-comverse.jpg", "category": "info-tech","link":"http://www.comverse.com"},
        {"customerName": "Convergys", "imageLink": "/images/client-logos/logo-convergys.jpg", "category": "info-tech","link":"http://www.convergys.com"},
        {"customerName": "Cypress Communications", "imageLink": "/images/client-logos/logo-cypress.jpg", "category": "telecommunications","link":"http://www.cypresscommunications.net"},
        {"customerName": "Deloitte", "imageLink": "/images/client-logos/logo-deloitte.jpg", "category": "services","link":"http://www.deloitte.com"},
        {"customerName": "Ecova", "imageLink": "/images/client-logos/logo-ecova.jpg", "category": "services","link":"http://www.ecova.com"},
        {"customerName": "Gartner", "imageLink": "/images/client-logos/logo-gartner.jpg", "category": "services","link":"http://www.gartner.com"},
        {"customerName": "GE Healthcare", "imageLink": "/images/client-logos/logo-ge.jpg", "category": "healthcare,info-tech,manufacturing","link":"http://www.gehealthcare.com"},
        {"customerName": "Henry Schein", "imageLink": "/images/client-logos/logo-henry.jpg", "category": "info-tech,healthcare,distribution","link":"http://www.henryschein.com"},
        {"customerName": "HP", "imageLink": "/images/client-logos/logo-hp.jpg", "category": "info-tech,services","link":"http://www.hp.com"},
        {"customerName": "Infor", "imageLink": "/images/client-logos/logo-infor.jpg", "category": "info-tech","link":"http://www.infor.com"},
        {"customerName": "Intuit", "imageLink": "/images/client-logos/logo-intuit.jpg", "category": "info-tech","link":"http://www.intuit.com"},
        {"customerName": "Ixia", "imageLink": "/images/client-logos/logo-ixia.jpg", "category": "info-tech,manufacturing","link":"http://www.ixiacom.com"},
        {"customerName": "Jack Henry", "imageLink": "/images/client-logos/logo-jack.jpg", "category": "info-tech","link":"http://www.jackhenry.com"},
        {"customerName": "Marconi", "imageLink": "/images/client-logos/logo-marconi.jpg", "category": "telecommunications,info-tech","link":"#"},
        {"customerName": "McKesson", "imageLink": "/images/client-logos/logo-mckesson.jpg", "category": "healthcare,info-tech","link":"http://www.mckesson.com"},
        {"customerName": "Mmodal", "imageLink": "/images/client-logos/logo-mmodal.jpg", "category": "info-tech,healthcare","link":"http://mmodal.com"},
        {"customerName": "Motorola", "imageLink": "/images/client-logos/logo-motorola.jpg", "category": "info-tech,manufacturing","link":"http://www.motorola.com"},
        {"customerName": "Nihon Kohden", "imageLink": "/images/client-logos/logo-nihon.jpg", "category": "healthcare,manufacturing","link":"http://www.nihonkohden.com"},
        {"customerName": "Owens and Minor", "imageLink": "/images/client-logos/logo-om.jpg", "category": "healthcare,distribution","link":"http://www.owens-minor.com"},
        {"customerName": "Paetec", "imageLink": "/images/client-logos/logo-paltec.jpg", "category": "telecommunications","link":"http://www.paetec.com"},
        {"customerName": "Polyvision", "imageLink": "/images/client-logos/logo-polyvision.jpg", "category": "telecommunications,manufacturing,distribution","link":"http://polyvision.com"},
        {"customerName": "Q2ebanking", "imageLink": "/images/client-logos/logo-q2.jpg", "category": "info-tech","link":"http://q2ebanking.com"},
        {"customerName": "Rubbermaid", "imageLink": "/images/client-logos/logo-rubbermaid.jpg", "category": "info-tech,healthcare,manufacturing","link":"http://www.rubbermaid.com"},
        {"customerName": "Wesco", "imageLink": "/images/client-logos/logo-wesco.jpg", "category": "distribution","link":"http://www.wesco.com"}

    ]
}

jQuery是：

$.getJSON('customers.json', function(data) {
                for(var index in definedCategoryArray){ //cycle through categories array
                    for(var i=0; i<data.customers.length; i++){ //cycle through json data
                        if (definedCategoryArray[index]==true){//if the value in the array is true (item checked)
                            console.log(data.customers[i].customerName+ ' : ' + data.customers[i].category);
                                if(data.customers[i].category.indexOf(',') != -1) //if there is more than one category, detect the comma seperating them
                                    categoriesPlural = data.customers[i].category.split(',');   
                                else //there is only one category
                                    categoriesPlural[0]=data.customers[i].category;
                                for (var y = 0; y<categoriesPlural.length; y++){
                                        //console.log(categoriesPlural[y]);
                                        if(categoriesPlural[y] == index){ //match category (from definedCategoryArray index) to items in json object to parse
                                            $('ul#customers').append('<li class="' +data.customers[i].customerName.replace(/\s+/g, '-') + '" id="'+data.customers[i].customerName.replace(/\s+/g, '-')+'"><a href="'+ data.customers[i].link +'" title="'+ data.customers[i].customerName +'" target="_blank"><img src="'+ data.customers[i].imageLink +'" alt="'+ data.customers[i].customerName +'" /></a></li>');
                                            checkDuplicates(data.customers[i].customerName.replace(/\s+/g, '-'));
                                        }
                                }
                        }
                    }
                }
            }).fail(function() { console.log( "error" ); });
4

2 回答 2

1

当有多个类别时，您正在为 categoriesPlural 分配一组全新的元素，但如果只有一个类别，您只需修改 categoriesPlural 的第一个元素，因此之前分配给 categoriesPlural 的任何内容（第一个元素除外）仍然存在.

而不是categoriesPlural[0]=data.customers[i].category你应该做categoriesPlural=[data.customers[i].category]

于 2013-05-13T03:51:05.283 回答
0

您没有声明或重置categoriesPlural. 当 之后只有一项时.split()，您将这一项粘贴在 中categoriesPlural[0]，但categoriesPlural[1]仍将保留其上一次迭代的值。categoriesPlural在循环开始时声明就可以了：

for(var i=0; i<data.customers.length; i++) {

  var categoriesPlural = [];
  ... // More of your code
于 2013-05-13T03:52:17.857 回答