2

test という名前の順序なしリストがあります

<ul id='test'></ul>

ajax を介して動的にデータが取り込まれます。各項目「li」は、「p」段落を含む div です。各段落にはいくつかの情報が含まれています。

元：

<li> <div> <p> test </p> </div> </li>
<li> <div> <p> hi how is it going?</p> </div> </li>
<li> <div> <p> not a test</p> </div> </li> 
<li> <div> <p> whoa</p> </div> </li>

検索語を取得できる検索ボックスもあります。次を使用します。

var searchTerm = $("#search").val().trim().split(' '); // an array of words searched for

私がやろうとしているのは、検索語のすべてまたは一部を含むすべての 'li' 要素を選択する方法を見つけることですが、最善のアプローチ方法がわかりません。

現在、私はこれをやっています： 

var results = $('p:contains("'+ searchTerm[0] +'")');

最初の用語で完全一致を取得しますが、1 つだけでなく複数の用語を検索したいです。

「test hi」を検索して 3 つのノードを取得すると、「test」と「hi」が検索されます。私も考えました：

var results2 = $('p').filter(function( index ) {
    return ( this +':contains("'+ searchTerm +'")' );
});

誰かが私を正しい方向に向けますか？

4

2 に答える 2

5

次のように、セレクターで黒魔術を行うことができます。

var results = $('p:contains("' + searchTerm.join('"), p:contains("') + '")');

難しそうですが、説明します。

で検索語を結合します"), p:contains("。p:contains("次に、不足している andを結果文字列の末尾に追加して")検索します。

于 2013-09-23T18:49:35.597 に答える
1

$.filterと $.each (または ie8 を気にしない場合は array.forEach)の組み合わせもここで使用できます。

var searchTerms = ["how", "test"];

$('div').filter(function () {
    $text = $(this).text();
    var found = 0;
    $.each(searchTerms, function (index, term) {
        found = $text.indexOf(term) > -1 ? found +1 : found;
    })
    return found;
}).addClass('match');

jsフィドル

于 2013-09-23T19:02:41.307 に答える