Я внедрил jQuery quickSearch (пример # 1 с изменениями) в шаблон WordPress успешно, но для того, чтобы он был действительно совершенным, мне нужна помощь, чтобы достичь того, что я хочу. Мне нужно настроить часть jQuery и это не мой сильный костюм.jQuery quickSearch/Live Search
В моем шаблоне header.php у меня есть:
<?php if(is_post_type_archive('books')){
?>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_directory')?>/js/jquery.quicksearch.js"></script>
<script type="text/javascript">
$(function() {
$('input#id_search').quicksearch('div#booklist div.cover');
});
</script>
<?php
}
?>
И в моем шаблоне WordPress (выезд из запроса):
<form action="#" id="searchform"><div><input autocomplete="off" type="text" name="s" class="search" id="id_search" onblur="if (this.value == '') {this.value = 'enter title of the book you are looking for...';}" onfocus="if (this.value == 'enter title of the book you are looking for...') {this.value = '';}" value="enter title of the book you are looking for..."/></div></form>
<div id="booklist">
<h4>Series Name</h4>
<div class="cover"><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title(); ?>"><img src="<?php echo $ftimg; ?>" alt="<?php the_title(); ?>" title="<?php the_title(); ?>" width="133" height="200" /></a>
<?php
echo "<br>";
the_title();
?>
</div>
<h4>Series Name #2</h4>
<div class="cover"><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title(); ?>"><img src="<?php echo $ftimg; ?>" alt="<?php the_title(); ?>" title="<?php the_title(); ?>" width="133" height="200" /></a>
<?php
echo "<br>";
the_title();
?>
</div>
and so on....
</div>
Когда я воспользоваться поиском, введя книгу название сейчас, не только эта одна книга появляется как результат, но и все заголовки h4. Мой желаемый визуальный результат состоял бы в том, что только заголовок книги h4 (то есть название серии, к которой принадлежит книга), и сама книга остается, а все остальные заголовки h4 «исчезают», как и остальные книги, не соответствующие запрос сделать.
может быть, это поможет вам, http://codepen.io/chriscoyier/pen/tIuBL, https://github.com/roparz/Light -Javascript-Table-Filter – amtest