Question

我正在使用以下jquery来获取具有多个类别的过滤器。

var getFilter = function(category) {
    var filter = $("#filters ." + category + ":checked").map(function() {
        return "." + this.value;
    }).get().join(",");
    filter = (filter.length > 0) ? filter : "*";
    console.log(filter);
    return filter;
}

$("#filters :checkbox").click(function() {
    var all = $(".filterme");
    var tgts = all.filter(getFilter("brand")).filter(getFilter("class")).filter(getFilter("color"));
    all.not(tgts).hide();
    tgts.show();
});

可以在http://jsfiddle.net/ar3PY/2/

上看到

除了我希望能够隐藏不相关的复选框之外，一切都很好。这意味着如果我选中“BMW”，那么“Audi”复选框应隐藏（不可点击），以及该结果中不存在的其他复选框，如“limousine”和“SUV”。

Answer 1

您需要将以下行添加到#filters :checkbox选择器上的点击处理程序：

$("#filters :checkbox").click(function() {
    var all = $(".filterme");
    var tgts = all.filter(getFilter("brand")).filter(getFilter("class")).filter(getFilter("color"));
    all.not(tgts).hide();
    tgts.show();

    var blockSiblings = $(this).is(':checked'); // determine whether or not to disable siblings
    $(this).siblings(':checkbox').prop('disabled', blockSiblings); // set the property
});

Example fiddle

jquery隐藏没有导致过滤器的复选框

1 个答案: