Javascript 多过滤器映射框（搜索和菜单）

我有一个mapbox地图，我可以根据搜索框和菜单按钮进行过滤，但一次只能使用其中一个

我有一个包含JSON数据的地图，其中包括提供的服务类型（菜单过滤器）和提供服务的县（搜索框过滤器）。我需要它的工作，使菜单上的过滤不会取消搜索框过滤器，反之亦然。我一直在试图找出如何将两者结合起来，但收效甚微。我还在类似于[here][1]的列表中显示过滤器的结果。非常感谢您的帮助。非常感谢。下面是我的过滤器代码

$('#search').keyup(search);
function search() {
    listings.innerHTML = '';

    // get the value of the search input field

    var searchString = $('#search').val().toLowerCase();
   $('#search').addClass('active').siblings().removeClass('active');

   locations.setFilter(showState);

// here we're simply comparing the 'county' property of each marker
// to the search string, seeing whether the former contains the latter.

   function showState(feature) {
    return feature.properties.county
        .toLowerCase()
        .indexOf(searchString) !== -1;
};
return false;
}

$('.menu-uiA a').on('click', function() {
    listings.innerHTML = '';

    // For each filter link, get the 'data-filter' attribute value.

    var filter = $(this).data('filter');
    $(this).addClass('active').siblings().removeClass('active');
    locations.setFilter(function(f) {

    // If the data-filter attribute is set to "all", return
    // all (true). Otherwise, filter on markers that have
    // a value set to true based on the filter name.

    return (filter === 'all') ? true : f.properties[filter] === true;
  });
return false;
});

---

为什么不引入一个统一的

SetFilterState

功能，该功能可以通过搜索上的

keyup

或菜单上的

单击来触发，它整合了需要传递到
setFilter
的搜索条件的所有条件，因此只有一个地方设置了实际的过滤器状态。
我能够将搜索和菜单过滤器与下面的代码结合起来

var searchString = $('#search').val().toLowerCase();                     
var filter = $('.menu-uiA a').data('filter');  

function combined_filter(f) {
    return ((f.properties.county
     .toLowerCase()
     .indexOf(searchString) !== -1) && ((filter === 'all') ?
true :f.properties[filter] === true))
};  

 $('#search').keyup('search', function() {
listings.innerHTML = '';
searchString = $('#search').val().toLowerCase();    

locations.setFilter(combined_filter);

return false;
});

 $('.menu-uiA a').on('click', function() {
listings.innerHTML = '';
filter = $(this).data('filter');
$(this).addClass('active').siblings().removeClass('active');

locations.setFilter(combined_filter);

return false;
});

你能提供一个具体的例子吗？我对javascript比较陌生。有没有可能把它放到JSFIDLE中，这样我们就可以看到更多的结构？