<div class="codetitle"> <span><a style="CURSOR: pointer" data="61495" class="copybut" id="copybut61495" onclick="doCopy('code61495')"><u>コードをコピー</u></a></span> コードは次のとおりです:</div> <div class="codebody" id="code61495"> <br>[html]<br><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/ xhtml1-transitional.dtd"> <BR><html xmlns="http://www.w3.org/1999/xhtml"> <br> <br><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <br><title>JQuery表格内容过滤</title> <br><style type="text/css"> <br>table{ border:0;border-collapse:collapse;} <br>div{font:normal 12px/17px Arial;} <br>td{ font:normal 12px/17px Arial;padding:2px;width:100px ;} <br>th{ font:bold 12px/17px Arial;text-align:left;padding:4px;border-bottom:1px Solid #333;width:100px;} <br>.even{ 背景:#FFF38F; } /* 奇数行样式*/ <br>.odd{ background:#FFFFEE;} /* 奇数行样式*/ <br>.selected{ background:#FF6500;color:#fff;} <br></スタイル＞ <BR><!-- jQuery の導入 --> <br><script src="jquery-1.5.2.min.js" type="text/javascript"></script> <br><script type="text/javascript"> <br> $(function(){ <br> $("#filterName").keyup(function(){ <br> $("table tbody tr") <br> .hide() <br> .filter( ":contains('" ( $(this).val() ) "')") <br> .show(); <br> }).keyup() <br> }) <br></スクリプト> <BR></head> <br> <br> <div> <br/> 説明： <input id="フィルタ名" name="フィルタ名" /> <br/> </div> <br> <br> <頭> <br> <tr><th>姓</th>gt;<th>性别</th><th>暂住地</th><</tr> <BR> </thead> <br> <tbody> <br> <tr><td>SYJ</td><td>男</td><td>河北秦皇岛市</td></tr> <br> <tr><td>李四</td><td>女</td><td>北京北京市</td></tr> <br> <tr><td>王五</td><td>男</td><td>河北秦皇岛市</td></tr> <br> <tr><td>赵六</td><td>男</td><td>河北唐山市</td></tr> <br> <tr><td>张三</td><td>男</td><td>内蒙古呼和浩特市</td></tr> <br> <tr><td>王六</td><td>女</td><td>内蒙古包头市</td></tr> <br> <tr><td>二狗</td><td>男</td><td>北京北京市</td></tr> <br> <tr><td>李字</td><td>女</td><td>河北秦皇岛市</td></tr> <br> <tr><td>二蛋</td>gt;<td>男</td><td>东北辽宁省</td></tr> <BR> </tbody> <br> </table> <br></body> <br></html> <br> </div> </div>
