javascript - 具有多个条件的 Jquery 过滤器

Question

我正在尝试根据餐厅的影响力来过滤餐厅列表。 我想使用 slider 而不是印度/亚洲/墨西哥/欧洲美食等通用类别。

餐厅可能是

[{restaurant: 
    {name: 'The Apollon',
    thumb: 'apollon.jpg',
    type: 
        [{spicy: 5, type_id: 1}
        {garlic:3, type_id:2}
        {expensive:10, type_id:3}]}
}]

然后，我将使用通用 JQuery UI slider 并将每个 slider 的值传递到隐藏元素。

这就是我完全陷入困境的地方。 我可以通过使用类而不是 JSON( .nospice .somespice .spicy ) 并执行 if (value >= 7) {$('.spicy').show();} 让它在一个 slider 上工作，但我不确定如何进行更高级的查询(if x = >=7 AND y = >=3 AND z = >=5)

有人想把我推向正确的方向吗？我需要读什么。如果我以一种极其错误的方式处理这件事，请告诉我。

jsfiddle:http://jsfiddle.net/techii/9e2cJ/

Answer 1

jQuery 有一个 .filter方法。我还建议您使用 .data 将餐厅对象与 div 一起存储。存储餐厅名称和类型及其 div:

$(".restaurants > div").filter(function(){
   var info = $(this).data("info");
   // Some code to extract things like spicyness, expensiveness
   // Also some code to get the slider values...
   if (spicynessSliderValue <= spicyness && expensivenessSliderValue <= expensiveness)
   {
       return true;
   }
}).show();

对于你的情况，我建议使用 $.each然而:

$(".restaurants > div").each(function(){
   ...
   var isMatch = picynessSliderValue <= spicyness && expensivenessSliderValue <= expensiveness;
   $(this).toggle(isMatch); // like .show or .hide, but takes a boolean
})