Показать сообщение отдельно
  #2 (permalink)  
Старый 07.06.2018, 20:24
Аватар для void()
Профессор
Отправить личное сообщение для void() Посмотреть профиль Найти все сообщения от void()
 
Регистрация: 11.08.2017
Сообщений: 208

Так?

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<input type="text" id="search" placeholder="Type to search">
<table id="table">
 <tr>
  <td>Apple</td>
  <td>Green</td>
</tr>
<tr>
  <td>Grapes</td>
  <td>Green</td>
</tr>
<tr>
  <td>Orange</td>
  <td>Orange</td>
</tr>
</table>
<button class="clear">Очистить</button>

<style>
body {padding: 20px;}
input {margin-bottom: 5px; padding: 2px 3px; width: 209px;}
td {padding: 4px; border: 1px #CCC solid; width: 100px;}
</style>

<script>
  var $rows = $('#table tr');
  $('#search').keyup(search);

  $('.clear').click(function(){
    $('#search').val('');
    $rows.show();
  });

  function search() {
    var val = $.trim($(this).val()).replace(/ +/g, ' ').toLowerCase();
    $rows.show().filter(function() {
      var text = $(this).text().replace(/\s+/g, ' ').toLowerCase();
      return !~text.indexOf(val);
    }).hide();
  }
</script>
Ответить с цитированием