Question

这里小提琴：http://jsfiddle.net/abhiklpm/ZEDR9/5/

这里我使用过滤器实现了多个复选框，但是在单击第二个复选框

时，过滤器会被覆盖

EX：如果我点击发货，所有发货将在下表中但与此同时，如果我点击 1GB 运输和1GB的交叉应该只是来，但运输选项被覆盖。

如果我点击运费＆amp;仅1GB（产品）Memory1应该。帮帮我吧

   **Script**

 $("input:checkbox").click(function () {
var showAll = true;
$('tr').not('.first').hide();
$('input[type=checkbox]').each(function () {
    if ($(this)[0].checked) {
        showAll = false;
        var status = $(this).attr('rel');
        var value = $(this).val();            
        $('td.' + status + '[rel="' + value + '"]').parent('tr').show();
    }
});
if(showAll){
    $('tr').show();
}
});

Answer 1

尝试创建一个过滤器集并循环遍历过滤器并将其应用为

var $checks = $("input:checkbox").click(function () {
    var $trs = $('tr').not('.first');

    var filters = {}, flag = false;
    $checks.filter(':checked').each(function () {
        var rel = $(this).attr('rel');
        filters[rel] = filters[rel] || [];
        filters[rel].push('.'+rel+'[rel="'+this.value+'"]');
        flag = true;
    })
    if (flag) {
        $trs.show();
        $.each(filters, function (rel, list) {
            $trs.not(':has('+list.join()+')').hide();
        });
    } else {
        $trs.show();
    }
});

演示：Fiddle

如何在Jquery中实现Multi复选框过滤器？

1 个答案: