jquery - 删除所有过滤器后还原为全部显示

Question

删除所有过滤器后，如何使此功能恢复为显示所有内容？

我试过if (attrColor == 'All') {...}改成if (attrColor == 'All' || attrColor == '') {...}

我在这里发布了一个简单的函数示例：http: //jsfiddle.net/chayacooper/WZpMh/88/

$(document).ready(function () {
    var selected = [];
    $('#attributes-Colors *').click(function () {
        var attrColor = $(this).data('color');
        var $this = $(this);
        if ($this.parent().hasClass("active")) {
            $this.parent().removeClass("active");
            selected.splice(selected.indexOf(attrColor),1);
        }
        else {
            $this.parent().addClass("active");
            selected.push(attrColor);
        }
        if (attrColor == 'All') {
            $('#content').find('*').show();
        } else {
        $("#content").find("*").hide();
        $.each(selected, function(index,item) {
            $('#content').find('[data-color *="' + item + '"]').show();
        });
        }
        return false;
    });
});   

Answer 1

看到这个：演示

if (attrColor == 'All' || !selected.length) {
    $('#content').find('*').show();
} else {
    $("#content").find("*").hide();
    $.each(selected, function (index, item) {
        $('#content').find('[data-color *="' + item + '"]').show();
    });
}

编辑：

根据@ArunPJohny 的建议进行更新：

使用.children()选择器会比 * 选择器更好地获取li孩子

if (attrColor == 'All' || !selected.length) {
    $('#content').children().show();
} else {
    $("#content").children().hide();
    $.each(selected, function (index, item) {
        $('#content').find('[data-color *="' + item + '"]').show();
    });
}