<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=bck">
<meta name="generator" content="PSPad editor, www.pspad.com">
<title></title>
<script src="./jquery-3.5.1.js"></script>
<script>
$(function(){
$("tr:not(:first):odd").addClass("odd");
$("tr:not(:first):even").addClass("even");
$("#table_list tr").click(function(){
$(this).addClass("select").siblings().removeClass("select");
$(this).find("input").prop("checked",true);
});
$("#txtQuery").keyup(function()
{
$("tr:not(:first)").hide().filter(":contains("+$("#txtQuery").val()+")").show();
})
});
</script>
<style>
.odd{
background:#FFFFEE
}
.even{
background:#FFF38F
}
.select
{
background:#FF6500
}
table
{
table-layout:fixed;
}
th
{
font-weight:bold;
width:100px;
}
td
{
text-align:center;
width:100px;
}
</style>
</head>
<body>
<div>
查询:<input id="txtQuery" name="txt" type="txt">
</div>
<table border="1" cellspacing="0" cellpadding="0">
<tr>
<th>姓名</th>
<th>性别</th>
<th>暂住地</th>
</tr>
<tr>
<td>张三</td>
<td>男</td>
<td>浙江宁波</td>
</tr>
<tr>
<td>李四</td>
<td>女</td>
<td>浙江杭州</td>
</tr>
<tr>
<td>王五</td>
<td>男</td>
<td>湖南常沙</td>
</tr>
<tr>
<td>赵六</td>
<td>男</td>
<td>浙江温州</td>
</tr>
<tr>
<td>Rain</td>
<td>男</td>
<td>浙江杭州</td>
</tr>
<tr>
<td>MAXMAN</td>
<td>女</td>
<td>浙江杭州</td>
</tr>
<tr>
<td>王六</td>
<td>男</td>
<td>浙江杭州</td>
</tr>
<tr>
<td>李字</td>
<td>女</td>
<td>浙江杭州</td>
</tr>
<tr>
<td>陈勇</td>
<td>男</td>
<td>湖南长沙</td>
</tr>
</table>
</body>
</html>
表单 查询
最新推荐文章于 2023-07-08 17:02:28 发布