您的位置:首页 > Web前端 > JQuery

jquery表格内容筛选

2012-12-17 14:11 295 查看
筛选:<input type="text" id="sea" />

<table width="100%" id="se">

<thead>

<tr><th></th><th>姓名</th><th>性别</th><th>地址</th></tr>

</thead>

<tbody>

<tr class="parent" id="row_01"><td colspan="3">一班</td></tr>

<tr class="child_row_01"><td></td><td>大爷</td><td>男10</td><td>武汉1</td></tr>

<tr class="child_row_01"><td></td><td>大爷</td><td>男9</td><td>武汉2</td></tr>

<tr class="child_row_01"><td></td><td>大爷</td><td>男8</td><td>武汉3</td></tr>

<tr class="parent" id="row_02"><td colspan="3">二班</td></tr>

<tr class="child_row_02"><td></td><td>大爷</td><td>男7</td><td>武汉4</td></tr>

<tr class="child_row_02"><td></td><td>大爷</td><td>男6</td><td>武汉5</td></tr>

<tr class="child_row_02"><td></td><td>大爷</td><td>男5</td><td>武汉6</td></tr>

<tr class="child_row_02"><td></td><td>大爷</td><td>男4</td><td>武汉7</td></tr>

<tr class="parent" id="row_03"><td colspan="3">三班</td></tr>

<tr class="child_row_03"><td></td><td>大爷</td><td>男3</td><td>武汉8</td></tr>

<tr class="child_row_03"><td></td><td>大爷</td><td>男2</td><td>武汉9</td></tr>

<tr class="child_row_03"><td></td><td>大爷</td><td>男1</td><td>武汉10</td></tr>

</tbody>

</table>

<script type="text/javascript" >

$(function(){

$("#sea").keyup(function(){

$("#se tbody tr").hide().filter(":contains('"+$(this).val()+"')").show();

}).keyup();

});

</script>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: