“.filter”可以检查目标是否具有多个属性？答案

【问题标题】：Can ".filter" check that target has multiple attributes?“.filter”可以检查目标是否具有多个属性？
【发布时间】：2015-01-19 21:13:18
【问题描述】：

我设置了一个复选框过滤器，我正在使用 .filter 过滤一些 div。

这是我的 Jquery：

$(document).ready(function(){
var checkboxes = $('div.filter-groups').find('input:checkbox'),
general = $('.general');

function filterCheckboxes(){
    var checked = checkboxes.filter(':checked');

    general.hide();
    $.each(checked, function(){
    var rel = $(this).data('filter');

        general.filter('.' + rel).show();
    });
}

checkboxes.on('click', filterCheckboxes);
});

这是网页： http://www.bluehavenhomes.com/floor-plans?hs_preview=1SQuQUzB-2347415373

这里是 jsfiddle： http://jsfiddle.net/jonathanSumner90/nh8vr1kp/1/

我需要.filter 在显示之前检查 div 是否具有所有复选框属性。有什么建议吗？

其次，为什么当我选中然后取消选中所有 div 不再出现的框时？可以解决吗？

【问题讨论】：

快速阅读这里api.jquery.com/filter 了解到filter 支持函数或回调。
仅供参考，您的 jsfiddle 与您在问题中发布的代码不匹配。
是的，但我已经知道了。在分配隐藏或显示之前，您会使用哪种函数将 div 的类项与多个选中复选框的数据进行比较？
rogMaHall 抱歉，我修复了链接。
div has all of the checked boxes attributes before displaying 是什么意思？甚至不清楚预期的行为是什么，或者你在说什么attributes

标签： javascript jquery html css filter

【解决方案1】：

你有两个问题：

你隐藏了所有的 div 但从不显示它。
您在每个 :checked 输入处隐藏，因此只考虑一个过滤器。

来自您的 jsFiddle：

$(document).ready(function () { $('div.filter-groups').find('input:checkbox').on('click', function () { $('.general').hide(); var selectors = []; var filters = $('div.filter-groups').find('input:checked'); filters.each(function () { selectors.push('div.general.' + $(this).attr('rel')); }); if (filters.length == 0) $('.general').show(); else { var selector = selectors.join(", "); $(selector).show(); } }); });

我没有完全测试过这段代码。希望对您有所帮助。

【讨论】：