1

始める前に、これは、指定されたテキストを含む divの検索の一種の「パート 2」です。

おい。div のリストを取得し、それぞれに (スタイルを設定する) いくつかの div があり、次のようになります。

<body>
<div class='divlist'>

<div>
    <div>abc</div><div>def</div><div>ghi</div>
</div>

</div>
</body>

bodyタグには検索もあります( <input type='text' id='search' />)

そして私のjquery：

$('#search').on('input', function(){
    var text = $(this).val();
    $('.divlist div').show();    
    $('.divlist div:not(:contains(' + text + '))').hide();
});

ここで、検索すると、 andabcを含む div が削除されますが、検索は div (内部に abcdefghi があるもの) と一致しました。では、一致するものがない場合 (たとえば) にメイン div を削除し、一致する div の数に関係なく、他の div を含む div 内のすべての div を表示する検索関数を作成するにはどうすればよいでしょうか。defghij

前もって感謝します。

ps。誰かがより良いタイトルを知っている場合は、自由に変更してください

4

1 に答える 1

1

divすべての要素をフィルタリングする代わりに、要素をフィルタリングし.divlistます。

$('.divlist:not(:contains(' + text + '))').hide();

divまたは、子セレクターを使用して直接の子:

$('.divlist > div:not(:contains(' + text + '))').hide();

高価なセレクター.filter()よりも効率的なメソッドを使用することもできます。:not(:contains())

$('.divlist > div').hide().filter(function() {
    return $(this).text().indexOf(text) > -1;   
}).show();
于 2013-09-30T20:46:35.573 に答える