jquery和JavaScript过滤问题

jquery and javascript filtering issue

本文关键字：问题 过滤 JavaScript jquery      更新时间：2023-09-26

我在这里的 JS 代码有两个问题，非常感谢任何帮助......

  1. 我需要添加一个逻辑，以便在产品价格为50美元时，"超过499"选项显示在过滤列表中。 使用我当前的实现，这是行不通的。

    <li>
    <!-- over 50 product is not showing when filtering -->
    <a href="/product-three">Product Four</a><br>
    <span id="lowestPriceRange">400</span>
    <span id="highestPriceRange">400</span>
</li>

// Because I need to handle it here somehow but I'm stuck
var hidePrices = {};
hidePrices[0] = true;
hidePrices[10] = true;
hidePrices[20] = true;
hidePrices[30] = true;
hidePrices[40] = true;
hidePrices[50] = true;
$('#products').find('span').each(function(i, el){
    var key = parseInt(Math.floor($(this).html() / 10) * 10, 10);
    hidePrices[key] = false;
});
$('#filterByPrice').find('li').each(function(i, el){
    if (hidePrices[Number($(this).find('a').attr('name'))]) {
        $(this).hide();
    }
});

  2. 它隐藏了一些我想展示的产品。 例如，当选择 $40 - $50 筛选选项时，我想显示价格在 40 美元到 60 美元之间的产品。

在这里我解决了您的问题：http://jsfiddle.net/qNFWM/7/

为了解决第一个问题，我添加了这个，因为您的密钥是 400：

if (key > 50) key = 50;

为了解决第二个问题，我更改了它：

return (minProductPrice >= minSelectedPrice && maxProductPrice <= maxSelectedPrice);

对此：

return ((minProductPrice >= minSelectedPrice &&  minProductPrice <= maxSelectedPrice) || (maxProductPrice >= minSelectedPrice &&  maxProductPrice <= maxSelectedPrice));

因此，只有最小值或最大值必须在该范围内。

相关文章：