0

この小さな検索例は機能しますが、初回のみです。

p 要素からすべてのクラスをクリアして、2 回目の検索時に前の検索のハイライトが表示されないようにするにはどうすればよいですか?

<!DOCTYPE html>
<html>
    <head>
        <script src="http://www.google.com/jsapi" type="text/javascript"></script>
        <script type="text/javascript">
            google.load('jquery', '1.4.2');
            google.setOnLoadCallback(function() {
                $('#searchButton').click(function() {

                 //remove all added classes so we can search again
                 //jQuery.each($('p'), function() {
                    //$('#' + this).addClass('');
                 //}

                 $('p:contains("' + $('#searchText').val() + '")').addClass('highlight');
                });
            });
        </script>
        <style>
            p.highlight {
                background-color: orange;
            }
        </style>
    </head>
    <body>
        <input id="searchText" value="second" />
        <button id="searchButton">Search</button>
        <p>This is the first entry.</p>
        <p>This is the second entry.</p>
        <p>This is the third entry.</p>
        <p>This is the fourth entry.</p>
    </body>
</html>
4

4 に答える 4

2

highlightすべてのクラスを削除してpから、一致した要素を再度強調表示できます。

$('p').removeClass('hightlight');
于 2010-08-18T16:42:40.457 に答える
1

すべてのクラスを削除する場合は、クラスで removeAttr を使用するか、クラスを "" に設定します。そう...

$('#searchButton').bind('click',function(){
  $('p').removeAttr('class');
  // OR
  $('p').attr('class','');
});

jQuery はコレクション内のすべての要素に対してこれらのアクションを自動的に実行するため、「each()」を使用する必要はありません。

于 2010-08-18T16:49:08.757 に答える
0

を使用removeClass()してクラスを削除し、再度検索してクラスを新しい一致に追加します。私がそれに取り組んでいる間、別の呼び出しを行う代わりに、作成されたばかりの要素filter()の選択を検索するために使用します。<p>$('p')$(...)

$('#searchButton').click(function() {
    $('p')
        .removeClass('highlight')
        .filter(':contains("' + $('#searchText').val() + '")')
        .addClass('highlight');
});
于 2010-08-18T16:40:48.783 に答える
0

removeClassを使用する

$('p').removeClass('highlight')前の検索からハイライト クラスだけ $('p').removeClass()を削除します すべての p からすべてのクラスを削除します

于 2010-08-18T16:41:35.133 に答える