jquery는 테이블 정렬 + 실시간 검색 기능을 구현합니다.-JS 튜토리얼-php.cn

이번에는 jquery구현테이블정렬+실시간 검색기능을 가져왔습니다. 테이블정렬+실시간 검색 기능을 구현한 jquery의 주의사항은 무엇인가요? 보세요.

jquery는 테이블 정렬 + 실시간 검색 기능을 구현합니다.

코드 복사 코드는 다음과 같습니다.

<table class="table-sort"> 
<thead> 
<tr> 
<th class="table-sort">First Name</th> 
<th class="table-sort">Last Name</th> 
<th class="table-sort">Email</th> 
<th>Phone Number</th> 
</tr> 
</thead> 
<tbody> 
<tr> 
<td>John</td> 
<td>Smith</td> 
<td><a href="mailto:john.s">john.s</a></td> 
<td>(613) 873-2982</td> 
</tr> 
<tr> 
<td>Sean</td> 
<td>MacIsaac</td> 
<td><a href="mailto:seanjmacisaac">seanjmacisaac</a></td> 
<td>(613) 871-6191</td> 
</tr> 
<tr> 
<td>Tim</td> 
<td>Zarby</td> 
<td><a href="mailto:zarbytown214@hotmail.com">zarbytown214@hotmail.com</a></td> 
<td>(613) 743-5389</td> 
</tr> 
<tr> 
<td>Andrew</td> 
<td>Nichols</td> 
<td><a href="mailto:andy_money2003">andy_money2003</a></td> 
<td>(613) 741-3384</td> 
</tr> 
<tr> 
<td>Ally</td> 
<td>O'Neil</td> 
<td><a href="mailto:allyoneil">allyoneil</a></td> 
<td>(613) 642-9831</td> 
</tr> 
</tbody> 
</table> 
<br/> 
<p>To make a table searchable, add the class 'table-sort-search' to the <table> tag.<br/> 
<br/> 
<strong>Example:</strong></p> 
<pre class="brush:php;toolbar:false"><code class="html"><table class="table-sort table-sort-search"></table></code>

로그인 후 복사

이 기사의 사례를 읽으신 후 방법을 마스터하셨다고 생각합니다. 더 흥미로운 내용을 보려면 PHP 중국어 웹사이트에 주목하세요Other 관련 기사!

관련 라벨：

jquery 实时排序

원천：php.cn

이전 기사：jquery는 테이블 로컬 정렬 기능을 만듭니다. 다음 기사：그룹화된 데이터로 테이블 헤더 정렬 기능 구현

본 웹사이트의 성명

본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.

저자별 최신 기사