Here is the JS code you need to modify:
var a=$("input.brand");
var b=$("input.store");
var brand=new Array();
var store=new Array();
$('input[type="checkbox"]').change(function(){
if($(this).is(":checked")){
$('#prod >div').hide();
if(this.className == "brand"){
console.debug("brand checked");
brand.push($(this).attr('id'));
}else if(this.className == "store"){
console.debug("store checked");
store.push($(this).attr('id'));
}
console.log(brand+","+store);
displaydivs(brand,store);
}else{
$('#prod >div').show();
if(this.className == "brand"){
var index = brand.indexOf($(this).attr('id'));
if (index > -1) {
brand.splice(index, 1);
}
}else if(this.className == "store"){
var index = store.indexOf($(this).attr('id'));
if (index > -1) {
store.splice(index, 1);
}
}
displaydivs(brand,store);
}
});
function displaydivs(brand,store)
{
$("#prod >div").hide();
if(brand.length > 0 & store.length > 0){
$.each(brand, function( index, value ){
var temp = $("#prod >div[data-brand="+value+"]")[0];
var data = $(temp).attr("data-store");
var idx = store.indexOf(data);
if(idx > -1){
$("#prod >div[data-brand="+value+"][data-store="+data+"]").show();
}
});
$.each(store, function( index, value ){
var temp = $("#prod >div[data-store="+value+"]")[0];
var data = $(temp).attr("data-brand");
var idx = brand.indexOf(data);
if(idx > -1){
$("#prod >div[data-brand="+data+"][data-store="+value+"]").show();
}
});
}
else if(brand.length > 0 & !(store.length > 0)){
$.each( brand, function( index, value ){
$("#prod >div[data-brand="+value+"]").show();
});
}
else if(!(brand.length > 0) & store.length > 0){
$.each( store, function( index, value ){
$("#prod >div[data-store="+value+"]").show();
});
}else{
$("#prod >div").show();
}
}
Demo : http://jsfiddle.net/qxxL2/4/
与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…