jQuery-如果没有'；不包含许多类中的一个

也许有一种更简单的方法，但我对jQuery还相当陌生，所以请耐心听我说。。。本质上，我试图创建一个包含所选复选框的所有值的数组，然后隐藏不包含所有这些值的div。下面是一些粗略的标记，以帮助说明我正在尝试做什么

/*** Sample Markup ***/
<div id="item-wrapper">
 <div class="blue red green ivory">Item 32323</div>
 <div class="green red">Item 34234</div>
 <div class="ivory blue green">Item 39403</div>
 <div class="red blue">Item 39923</div>
 <div class="green">Item 32990</div>
</div>

<input type="checkbox" class="checkbox-filter" name="filter[]" value="red" CHECKED />RED
<input type="checkbox" class="checkbox-filter" name="filter[]" value="ivory" />IVORY
<input type="checkbox" class="checkbox-filter" name="filter[]" value="blue" CHECKED />BLUE
<input type="checkbox" class="checkbox-filter" name="filter[]" value="green" />GREEN

---

在内部循环中，您只需为每个类检查

.hasClass

：

var item = $(this);
selectedFilters.forEach(function(filter) {
    if (!item.hasClass(filter)) {
        item.hide();
    } 
});

（另外，确保在“单击”处理程序中声明或清除了

selectedFilters

。）

---

在内部循环中，您只需为每个类检查

.hasClass

：

var item = $(this);
selectedFilters.forEach(function(filter) {
    if (!item.hasClass(filter)) {
        item.hide();
    } 
});

（另外，确保在“单击”处理程序中声明或清除了

selectedFilters

。）

试试看

var $divs = $('#item-wrapper > div')
var $checks = $('input[name="filter[]"]');
$checks.change(function(){
    var classes = $checks.filter(':checked').map(function(){
        return this.value
    }).get();
    if(classes.length){
        $divs.hide().filter('.' + classes.join('.')).show();
    } else {
        $divs.show();
    }
}).change()

演示：

试试看

var $divs = $('#item-wrapper > div')
var $checks = $('input[name="filter[]"]');
$checks.change(function(){
    var classes = $checks.filter(':checked').map(function(){
        return this.value
    }).get();
    if(classes.length){
        $divs.hide().filter('.' + classes.join('.')).show();
    } else {
        $divs.show();
    }
}).change()

演示：