1

我正在尝试使用 JQuery 制作一个过滤器，该过滤器隐藏所有 div，然后仅显示 div，具体取决于它内部名为“brand”的类，我设法让它隐藏所有 div，但它不会显示与该类匹配的那些。

我在声明中添加的警报正在显示，所以我认为这可能与父节目有关，有人有什么想法吗？

的HTML：

<div class="section-link" id="section-tooltip" data-content="Popup with option trigger" rel="popover" data-placement="right" title="" data-original-title="">
    <div class="section-features" style="display: none;">
        <p><i class="icon-star"></i> protective, waterproof lid</p>
        <p><i class="icon-star"></i> enhanced wooden coating</p>
        <p><i class="icon-star"></i> long lasting materials</p>
        <p><i class="icon-star"></i> 2 year warranty</p>
        <p><i class="icon-star"></i> includes durable bag</p>
    </div>

    <div class="brand tp" style="display: none;"></div>
    <div class="price" style="display: none;"> £47.99</div>
    <a href="Garden-Games-Picnic-Table-Sandpit-6407.html">
        <img src="picnic_table_sandpit.jpg" title="Garden Games Picnic Table Sandpit" alt="Garden Games Picnic Table Sandpit" width="220">
        <h3 align="center">Garden Games Picnic Table Sandpit</h3>
        <p align="center">
            <span> was: £69.99</span>
            <span> Now:  £47.99</span>
            <span class="button">More Info</span>
        </p>
        </a>
    <a name="a6407"></a>
</div>

// 大约有 20 个这样的 div 具有不同的品牌类 example class="brand garden"

JS：

function brand(string){
    var brand = string;
    $('.section-link').hide();
    if ($('.section-link').children('.brand').hasClass(brand)) {
        alert(brand);
        $(this).parent().show();
    }
}

我也在通过 chrome url 栏进行测试javascript: brand("tp");

非常感谢任何帮助，西蒙

4

1 回答 1

4

您需要在这里使用多个选择器，因为您需要获取.brand也具有指定类的元素

function brand(string){
    var brand = string;
    $('.section-link').hide();
    $('.section-link').children('.brand.' + brand).parent().show();
}

演示：小提琴

于 2013-07-22T08:14:11.870 回答