使用基于HTML输入的Jquery过滤表数据

Question

可以请你帮我编写Jquery的正确方法，这样我可以根据文本输入过滤HTML表格。到目前为止，这是我的代码：

<input type="text" name="inputdata" id="inputdata" onkeyup="filter()"> 
    <table> 
      <tr> 
       <th>ID</th> 
       <th>Name</th> 
      </tr> 
      <tr name="data"> 
       <?php foreach ($products as $row) { ?> 
       <td><?php echo $row->id_product; ?></td> 
       <td><?php echo $row->name; ?></td> 
       <?php } ?> 
      </tr> 

jQuery代码

<script> 
    function filter(){ 
     inp = $('#inputdata').val() 
     $("tr").filter(function() { 
      return $(this).text().indexOf(inp) == -1; 
     }).hide(); 
    } 
</script> 

所以我的问题是：

1. 搜索是区分大小写的
2. 当我输入一些字符串，让我们说裤子，Jquery过滤数据，但后来我必须刷新页面，所以我可以再次搜索。或者让我以另一种方式...当我删除搜索字段中的输入数据时，表不刷新。它只是留在裤子的数据，所以对于另一个搜索，我不得不重新加载网页
3. <th>在搜索数据时被删除。如果我声明$('tr[name=data]').filter(function() {搜索停止工作

thx提前帮助我！

Answer 1

这应该采取的您的问题护理：

<script> 
function filter(){ 
    inp = $('#inputdata').val() 
    // This should ignore first row with th inside 
    $("tr:not(:has(>th))").each(function() { 
     if (~$(this).text().toLowerCase().indexOf(inp.toLowerCase())) { 
      // Show the row (in case it was previously hidden) 
      $(this).show(); 
     } else { 
      $(this).hide(); 
     } 
    }); 
} 
</script>