Как удалить все классы из коллекции $ ('p')? - PullRequest
0 голосов
/ 18 августа 2010

Этот небольшой пример поиска работает, но только в первый раз.

Как очистить все классы от элементов p, чтобы при поиске во второй раз выделение из предыдущего поиска не отображалось?

<!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 ]

2 голосов
/ 18 августа 2010

Вы можете удалить класс highlight на всех p, а затем снова сделать подсветку для соответствующих элементов.

$('p').removeClass('hightlight');
1 голос
/ 18 августа 2010

Если вы хотите удалить ВСЕ классы, вы можете использовать removeAttr для класса или установить для класса значение "".Итак ...

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

Использование «each ()» не обязательно, поскольку jQuery автоматически выполнит эти действия для всех элементов в коллекции.

0 голосов
/ 18 августа 2010

Использование removeClass

$('p').removeClass('highlight') удалит только класс подсветки из предыдущего поиска $('p').removeClass() удалит все классы из всех p

0 голосов
/ 18 августа 2010

Используйте removeClass(), чтобы удалить класс, затем выполните поиск снова и добавьте класс к новым совпадениям.Пока я в этом, я буду использовать filter() для поиска по выбору <p> элементов, которые были только что сделаны с $('p'), вместо того, чтобы делать еще один $(...) вызов:

$('#searchButton').click(function() {
    $('p')
        .removeClass('highlight')
        .filter(':contains("' + $('#searchText').val() + '")')
        .addClass('highlight');
});
...