Question

我在jquery mobile的帮助下创建了一个listview，它目前显示了4个列表项。该列表是使用javascript生成的。

$( document ).ready(function() {
var data = [{
        "name": "Lichtbediening",
        "category": "category",
        "info": "Klik voor lichtbediening",
        "img": "lichtbediening"
}, {
        "name": "Stopcontact",
        "category": "category",
        "info": "Klik voor stopcontacten",
        "img": "stopcontacten"
}, {
        "name": "Enkele schakelaar",
        "info": "Een knop, een lamp",
        "img": "rolluikbediening"       
}, {
        "name": "Dubbele schakelaar",
        "info": "Twee knoppen, twee lampen",
        "img": "multimedia"     
}];

var output = '';
$.each(data, function (index, value) {
    output += '<li><a href="#">'
    output += '<img src="img/' + value.img + '.jpg">'
    output += '<h2>' + value.name +'</h2>'
    output += '<p>' + value.info + '</p>'
    output += '</a></li>';
});

$('#list_zoek_category').html(output).listview("refresh");

});

此时它显示＆＃34;每个＆＃34;将数据中的行作为列表中的列表项。但我想只显示category == category的列表项。

有没有人知道如何才能做到这一点？

Answer 1

如下所示

$.each(data, function (index, value) {
    if(value.category != 'category')
        return;  // So basically If value.category is not equal to 'category` do nothing, EARLY EXIT.
    output += '<li><a href="#">'
    output += '<img src="img/' + value.img + '.jpg">'
    output += '<h2>' + value.name +'</h2>'
    output += '<p>' + value.info + '</p>'
    output += '</a></li>';
});

Answer 2

$.each(data, function (index, value) { if(value.category == "category") { output += '<li><a href="#">' output += '<img src="img/' + value.img + '.jpg">' output += '<h2>' + value.name +'</h2>' output += '<p>' + value.info + '</p>' output += '</a></li>'; } });

没有经过测试，但你可以试试。

Answer 3

只需添加条件测试，首先检查对象值是否具有类别属性，然后检查它是否符合您的要求：

var output = '';
$.each(data, function (index, value) {

    if (value.category && value.category==='category') {
       output += '<li><a href="#">'
       output += '<img src="img/' + value.img + '.jpg">'
       output += '<h2>' + value.name +'</h2>'
       output += '<p>' + value.info + '</p>'
       output += '</a></li>';
    }

});

使用javascript仅显示listview中的某些列表项

3 个答案: