jquery隐藏过滤器中没有结果的复选框

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/

一切都很正常。 如果我检查“宝马”，那么“奥迪”复选框应该隐藏（不可点击），以及结果中不存在的其他复选框，如“豪华轿车”和“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