<!DOCTYPE html>
<html lang="zh-cn">
<head>
 <meta charset="utf-8">
 <title></title>
 <style>

    table{
   border:1px solid #000;
   width: 400px;
   text-align: center;
   border-collapse: collapse;
  }
  thead tr{
   border: 1px solid #000;
  }
 </style>
</head>
<body>
  <table>
  <thead>
    <tr>
    <th colspan="3">筛选：<input id="filterName" type="text"/></th>
   </tr>
  </thead>
  <tbody>
    <tr class="child_row_01"><td>张山1</td><td>男</td><td>浙江宁波</td></tr>
    <tr class="child_row_01"><td>王山2</td><td>男</td><td>浙江宁波</td></tr>
    <tr class="child_row_02"><td>李山3</td><td>男</td><td>浙江余杭</td></tr>
    <tr class="child_row_02"><td>张山4</td><td>男</td><td>浙江宁波</td></tr>
    <tr class="child_row_03"><td>李山5</td><td>男</td><td>浙江宁波</td></tr>
    <tr class="child_row_03"><td>张山6</td><td>男</td><td>浙江宁波</td></tr>
  </tbody>
 </table>
</body>
<script src="js/jquery-1.11.3.js"></script>
<script>
$(function(){
  $("#filterName").keyup(function(){
  $("table tbody tr").hide()
   .filter(`:contains('${$(this).val()}')`).show();
 });
});

</script>
</html>

Jquery 组 tbale表格筛选的更多相关文章

  1. Jquery 组 tbale表格滚动条

    <!DOCTYPE html><html lang="zh-cn"><head> <meta charset="utf-8&qu ...

  2. Jquery 组 tbale表格隔行变色

    <!DOCTYPE html><html lang="zh-cn"><head> <meta charset="utf-8&qu ...

  3. jquery实现多条件筛选特效代码分享

    本文实例讲述了jquery实现多条件筛选特效.分享给大家供大家参考.具体如下:jquery实现的多条件搜索表单带日期选择表格表单效果源码,是一段实现了多个条件筛选搜索的特效代码,多条件拥有时间.地点. ...

  4. jQuery-1.9.1源码分析系列（二）jQuery选择器续2——筛选

    前面分析了选择器的结构和几个解析函数,接下来分析jQuery对象的伪类选择器.这里所谓的jQuery对象的伪类选择器就是从已有的jQuery对象(元素集合)中筛选出指定的集合出来. 4.    jQu ...

  5. jquery隐藏table表格的某一列

    jquery隐藏table表格的某一列: $('table tr').find('td:eq(13)').hide(); 隐藏table的第13列

  6. jquery 动态添加表格行

    jquery 动态添加表格行 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <h ...

  7. jQuery动态对表格Table进行添加或删除行以及修改列值操作

    jQuery,不仅可以以少量的代码做很多操作,而且兼容性好(各种浏览器,各种版本). 下面用jQuery动态对表格Table进行添加或删除行以及修改列值操作 1.jQuery代码 <script ...

  8. MySql中having字句对组记录进行筛选使用说明

    having字句可以让我们筛选成组后的各种数据 having的用法 having字句可以让我们筛选成组后的各种数据,where字句在聚合前先筛选记录,也就是说作用在group by和having字句前 ...

  9. 第84天：jQuery动态创建表格

    jQuery动态创建表格 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&q ...

随机推荐

  1. 2017-2018-2 20155314《网络对抗技术》Exp5 MSF基础应用

    2017-2018-2 20155314<网络对抗技术>Exp5 MSF基础应用 目录 实验内容 实验环境 基础问题回答 预备知识 实验步骤--基于Armitage的MSF自动化漏洞攻击实 ...

  2. Java基础之集合篇（模块记忆、精要分析）

    千里之行,始于足下.把别人的变成自己,再把自己的分享给别人,这也是一次提升的过程.本文的目的是以一篇文章从整体把握集合体系又不失一些细节上的实现,高手路过. 集合的作用与特点 Java是一门面向对象语 ...

  3. junit常用注解详细说明

    Java注解((Annotation)的使用方法是@注解名 ,能通过简单的词语来实现一些功能.在junit中常用的注解有@Test.@Ignore.@BeforeClass.@AfterClass.@ ...

  4. PAT A1018 Public Bike Management （30 分）——最小路径，溯源，二标尺，DFS

    There is a public bike service in Hangzhou City which provides great convenience to the tourists fro ...

  5. Linux加密、安全版块、root密码破解

    当一个入侵者进入了你的系统并且种植了木马,通常会想办法来隐蔽这个木马(除了木马自身的一些隐蔽特性外,他会尽量给你检查系统的过程设置障碍),通常入侵者会修改一些文件,比如管理员通常用ps -aux来查看 ...

  6. mac修改本机mysql的root密码

    今天同事的MAC上的mysql的登陆密码忘记了,问我是否能解决,呵呵   我查了下    并做个记录 1. 在系统偏好设置中关闭 mysql : Stop MySQL Server 2.打开终端 进入 ...

  7. AI 蒙特卡罗算法

    蒙特卡罗算法,是一类随机算法,用于求近似解. 1.Las Vegas(拉斯维加斯)算法和蒙特卡罗算法 两者都是随机算法. 前者:要么正确解,要么错误解.采样越多,越有可能得到正确解. 后者:近似解.采 ...

  8. Objective-C GCD深入理解

    GCD(Grand Central Dispatch),主要用于多线程编程.它屏蔽了繁琐的线程实现及管理细节,将其交由系统处理.开发者只需要定义任务block(在底层被封装成dispatch_cont ...

  9. AI 隐马尔科夫模型

    隐马尔科夫模型(Hidden Markov Model,简称HMM),

  10. day82

    今日内容: 1.CBV源码分析: CBV:class base view(基于类的视图函数) FBV:function base view(基于方法的视图函数) 要想使用CBV首先需要导入 from ...