我该怎么做呢?
我有用于类型和过滤表数据的 html 和 jquery 代码(http://jsfiddle.net/tutorialdrive/YM488/),并在同一个输入框中键入和标记数据,但我想合并两者。
我也有标签代码,但丢失了它的库名称,所以我无法在 jsfiddle 上添加它,
即当我输入搜索名称时,或单击表格数据(01 姓名姓氏等)。数据应标记在上面的标签区域(测试 x,测试 x)。
这是我在表格中搜索的 html 和 jquery 代码
HTML
<!-- table for search and filter start -->
<label for="kwd_search">Search:</label> <input type="text" id="kwd_search" value=""/>
<table id="my-table" border="1" style="border-collapse:collapse">
<thead>
<tr>
<th>Name</th>
<th>Sports</th>
<th>Country</th>
</tr>
</thead>
<tbody>
<tr>
<td>Sachin Tendulkar</td>
<td>Cricket</td>
<td>India</td>
</tr>
<tr>
<td>Tiger Woods</td>
<td>Golf</td>
<td>USA</td>
</tr>
<tr>
<td>Maria Sharapova</td>
<td>Tennis</td>
<td>Russia</td>
</tr>
</tbody>
</table>
<!-- table for search and filter ends -->
jQuery代码
/* jquery for search nad filter table start*/
$(document).ready(function(){
// Write on keyup event of keyword input element
$("#kwd_search").keyup(function(){
// When value of the input is not blank
var term=$(this).val()
if( term != "")
{
// Show only matching TR, hide rest of them
$("#my-table tbody>tr").hide();
$("#my-table td").filter(function(){
return $(this).text().toLowerCase().indexOf(term ) >-1
}).parent("tr").show();
}
else
{
// When there is no input or clean again, show everything back
$("#my-table tbody>tr").show();
}
});
});
/* jquery for search nad filter table ends*/