Question

我想要这样做才能显示包含所有已检查项目的类，而不是只需要一个。

$(".wpbdp-listing:visible").hide();
checkedboxes.each(function() {
    $('.' + $(this).val()).closest('.wpbdp-listing').show();
});

目前，如果您选择＆＃34; Color＆＃34;和＃34; Custom＆＃34;它将显示包含EITHER颜色或自定义的结果。我希望它只显示包含颜色和自定义的结果。

Answer 1

在ToggleThings函数中进行以下更改，您需要在其中创建选中复选框的值列表，然后将其用作jQuery选择器以查找div

function ToggleThings()
{

    var checkedboxes = $("#filters :checkbox:checked");

    if(checkedboxes.length > 0)
    {
        $(".wpbdp-listing:visible").hide();
        //create a string of '.' (dot) preceded class name list
        var classess = '';     
        checkedboxes.each(function() {
            classess+='.' + $(this).val();
        });
        //use class string to find all div
        $(classess).closest('.wpbdp-listing').show();
    }
    else
    {
        $(".wpbdp-listing").show();
    }
}

<强> DEMO

Answer 2

您可以选择以下多个类：

$(".class1.class2.class3.class545645").doWhatYouWant();

因此，您可以在.each()：

中为您的班级创建这样的选择器

var selector = "";
checkedboxes.each(function(){
    selector += "."+$(this).val();
});

现在您可以使用此选择器显示项目：

$(selector).closest('.wpbdp-listing').show();

jQuery组合复选框值来修改输出

2 个答案: