특정 열의 jQuery 테이블 필터

Question

많은 정보가 담긴 테이블이 있습니다. 첫 번째 열은 이름이고, 두 번째 열은 성이며, 세 번째 열은 숫자입니다. 사용자 입력을 기반으로 모든 행을 표시하려고하지만 검색 필터가 ID가있는 특정 열을 통과하기를 원합니다.

JQuery와 코드 : 내가 가진 :

(document.ready(function() 


$("#searchHere").keyup(function() { 
    var $row = $("table tr"); 
    var $col = $("td").each().index(); 
    var input = this.value.toLowerCase(); 

    $row.show().filter(function() { 
    $(this).find("td").eq(col).text().toLowerCase(); 
    return $(this).text(input); 
    }).hide(); 
}); 

HTML 코드

<input id="searchHere" placeholder="Search Me"> 

<table> 
<tr> 
    <td id='firstName'>John</td> 
    <td id='lastName'>Doe</td> 
    <td>One Two Three</td> 
</tr> 

<tr> 
    <td id='firstName'>John</td> 
    <td id='lastName'>Smith</td> 
    <td>Two Three</td> 
</tr> 
</table> 

내가이 게시물을 참조했습니다,하지만 난 퍼즐의 마지막 조각을 알아낼 수 없습니다 .

How to perform a real time search and filter on a HTML table

Answer 1

당신은 입력을 분리 반대로 각 셀에 보이는 하나의 글로벌 검색 상자를 가질 수있다.