使用基於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>