Question

我设置了一个复选框过滤器，我使用.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不再出现的框时？可以修复吗？

Answer 1

你有两个问题：

你隐藏所有div但从未显示过。
您隐藏在每个：已检查的输入中，因此只考虑一个过滤器。

来自你的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(); } }); });

我没有对此代码进行全面测试。希望它有所帮助。

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

1 个答案: