p Быстрый поиск по списку/таблице и т.д. — Данил Самигуллин
+7 982 100 5 999

Быстрый поиск по списку/таблице и т.д.

HTML

<input type="text" name="search" id="search" placeholder="Быстрый поиск ...">
<ul>
    <?php query_posts('posts_per_page=-1');?>
    <?php if ( have_posts() ) : ?>
    <?php while ( have_posts()) : the_post(); ?>
    <li class="list-news--inner">
        <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
    </li>
    <?php endwhile; ?>
    <?php endif; ?>
    <?php wp_reset_query();?>
</ul>

Jquery

(function(){
    $(document).ready(function() {
        $('#search').keyup(function(event) {
            if (event.keyCode == 27 || $(this).val() == '') {
                $(this).val('');
                $('.list-news--inner').removeClass('name').show().addClass('name');
            }
            else {
                filter('.list-news--inner', $(this).val());
            }
        });
    });
    function filter(filter, query) {
        query =	$.trim(query);
        $(filter).each(function() {
            ($(this).text().search(new RegExp(query, "i")) < 0) ? $(this).hide().removeClass('name') : 
            $(this).show().addClass('name');
        });
    }
})();