Question

你好我有这个很酷的脚本，当输入一些字母时，有些人输入了一些单词，我希望这对其他人也很有用。

您可以在此处看到它：FIDDLE

我的代码：

<input id="filter" />
<ul id="productlist">
    <li><h2>Andy</h2><span>some text</span></li>
    <li><h2>Sandra</h2><span>some text</span></li>
    <li><h2>Pizza</h2><span>some text</span></li>
    <li><h2>Drink</h2><span>some text</span></li>
</ul>

var $products = $('#productlist li h2');
$('#filter').keyup(function() {
    var re = new RegExp($(this).val(), "i"); // "i" means it's case-insensitive
    $products.show().filter(function() {
        return !re.test($(this).text());
    }).hide();
});

所以我需要它不仅隐藏H2而且隐藏整个li元素及其中的内容。

PS：请不要告诉我从 var $ products = $（'＃productlist li h2'）; 更改为var $ products = $（'＃productlist li'）; 我需要搜索只适用于h2元素

Answer 1

你应该能够做到：

var $products = $('#productlist li');
$('#filter').keyup(function() {
    var re = new RegExp($(this).val(), "i"); // "i" means it's case-insensitive
    $products.show().filter(function() {
        return !re.test($('h2',this).text());
    }).hide();
});

实例：http://jsfiddle.net/7CVgL/

（注意：我做过你让我不要做的事，但它仍然只搜索h2元素的内容）

JS条件隐藏元素

1 个答案: