如何在表中搜索？

Question

我如何使用下表以及小写和大写搜索过滤器搜索任何有关JavaScript的帮助将不胜感激谢谢：）

<div class="title">

<h3>Products</h3>

</div>
<table class="list">
    <thead>
        <tr>
            <th class="left">List A</th>
            <th class="right">List B</th>
        </tr>
    </thead>
    <tbody class="table-hover">
        <tr>
            <td class="left">apple</td>
            <td class="rightt">100</td>
        </tr>
        <tr>
            <td class="left">snapple</td>
            <td class="right">200</td>
        </tr>
        </tr>
    </tbody>
</table>

Answer 1

看看这个：http://jsfiddle.net/csdtesting/w3f9gx5c/

var $rows = $('.list tr');
$('#search').keyup(function() {
  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 src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
 
<input type="text" id="search" placeholder="Type to search" />
<table class="list">
  <tbody class="table-hover">
    <tr>
      <td class="left">apple</td>
      <td class="rightt">100</td>
    </tr>
    <tr>
      <td class="left">snapple</td>
      <td class="right">200</td>
    </tr>
    <tr>
      <td class="left">SNAPPLE</td>
      <td class="right">200</td>
    </tr>
    <tr>
      <td class="left">APPLE</td>
      <td class="right">200</td>
    </tr>
    </tr>
  </tbody>
</table>

Answer 2

$('tr td:contains("text to search for")') //returns all td tags that have the text you enter

Case insensitive :contains，来自Google。