Question

在我的旅游网站中，我想使用多个复选框过滤搜索结果。目前我的代码工作如下。

如果我查看“近机场”，它将仅显示带有“机场”数据标签的酒店。但是，当我想同时过滤靠近机场和购物区的酒店时，它将无法运作。它显示了具有“机场”或“购物”数据标签的酒店列表。我想更改它以列出同时包含“机场”和“购物”数据标签的酒店。

的屏幕截图

上下文代码

$(document).ready(function(){
    $('.category').on('change', function(){
      var category_list = [];
      $('#filters :input:checked').each(function(){
        var category = $(this).val();
        category_list.push(category);
      });

      if(category_list.length == 0)
        $('.resultblock').fadeIn();
      else {
        $('.resultblock').each(function(){
          var item = $(this).attr('data-tag');
          var itemarr = item.split(',');
          $this = $(this);
          $.each(itemarr,function(ind,val){
            if(jQuery.inArray(val,category_list) > -1){
              $this.fadeIn('slow');
              return false;
            }
            else
              $this.hide();
          });
        });
      }   
    });
  });

Answer 1

您需要确保category_list数组中itemarr数组中的所有元素都可用。帖子How to check whether multiple values exist within an Javascript array应该解决您的问题，例如在else块中，修改您的代码如下：

 var item = $(this).attr('data-tag');
 var itemarr = item.split(',');
 var hideItem = false;
 for(var i = 0 , len = itemarr.length; i < len && !hideItem; i++){
     hideItem = ($.inArray(itemarr[i], category_list) == -1);
  }
  if(hideItem) {
    $this.hide();
  } else {
    $this.fadeIn('slow');
  }

使用AJAX多次检查搜索结果过滤器

1 个答案: