У меня есть этот фильтр для списка html, который я получил из Keyup фильтровать несколько списков с заголовками с помощью jQuery. Проблема в том, что как только вы наберете неправильное слово/символ, которого нет в списке, оно как бы сломается и не будет работать, пока вы полностью не сотрете/удалите его из поля ввода. Есть ли способ исправить исходный код, чтобы он работал даже после того, как вы просто удалили неправильный символ?
http://jsfiddle.net/thesystemrestart/zzG4f/5/
HTML:
<ul id="workflow_books">
<li>
<h6 class="custom"> Custom Books</h6>
<ul>
<li class="custom-books">
<a>Don't see your book in our list? Add it yourself!</a>
</li>
</ul>
</li>
<li>
<h6>Academic</h6>
<ul>
<li>
<a>Academic Book One</a>
</li>
<li>
<a>Academic Book Two</a>
</li>
</ul>
</li>
<li>
<h6>Botany</h6>
<ul>
<li>
<a>Botany Book One</a>
</li>
<li>
<a>Botany Book Two</a>
</li>
</ul>
</li>
</ul>
JQuery
var $products = $('#workflow_books li ul');
$("#search").keyup(function() {
var val = this.value.trim();
if (!val) $('li:hidden', '#workflow_books').show();
else {
$('li:hidden', $products).show();
$('li', $products).filter(function() {
var re = new RegExp(val, 'ig');
return !re.test($('a', this).text());
}).hide();
$products.each(function() {
if ($('li:visible', this).length == 0) $(this).parent('li').hide();
else $(this).parent('li').show();
});
}
});
Буду очень признателен за любую помощь. Спасибо.