用jquery做一个筛选信息的效果。首先要加入对jquery的支持,这个自己加即可
jsp页面:
筛选:<input type="text" id="shai"/>
<table>
<thead><tr><td>姓名</td><td>性别</td><td>年龄</td><td>生日</td></tr></thead>
<tbody>
<tr><td>张三</td><td>男</td><td>15</td><td>1999</td></tr>
<tr><td>李四</td><td>男</td><td>18</td><td>1999</td></tr>
<tr><td>王五</td><td>男</td><td>15</td><td>1999</td></tr>
</tbody>
</table>
js代码:
<script>
$(document).ready(function(){
$("#shai").keyup(function(){
$("table tbody tr").hide().filter(":contains('"+($(this).val())+"')").show();
});keyup();//这句一定要有。
})
</script>
效果:
当在输入框输入“张”或者表格中任意一个字时,会将该行筛选出来。