<!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. oracle 查询 磁盘使用率

    SELECT d.tablespace_name "Name",        TO_CHAR(NVL(a.bytes / 1024 / 1024 / 1024, 0), '99, ...

  2. VsCode源码编译运行

    参考链接官方文档:https://github.com/Microsoft/vscode/wiki/How-to-Contribute 一.准备环境 Git Node.js(64位,>= 8.1 ...

  3. Spring定时任务使用和如何使用邮件监控服务器

    Spring相关的依赖导入进去,即可使用spring的定时任务! <!-- spring核心包 --> <dependency> <groupId>org.spri ...

  4. ubuntu16.04下zabbix安装和配置

    介绍 Zabbix是用于网络和应用的开源监控软件. 它提供从服务器,虚拟机和任何其他类型的网络设备收集的数千个度量的实时监控. 这些指标可以帮助您确定IT基础架构的当前运行状况,并在客户投诉之前检测硬 ...

  5. QT中子目录调用另一个子目录

    解决办法: 第一:建立一个subdirs项目,子项目管理 第二:添加二个子项目例如:A子项目   B子项目 第三:现在A子项目调用 B子项目 在A子项目中:右键>添加库>内部库(把A添加进 ...

  6. java 设计模式之模板方法

    模板方法的定义 定义了一个算法的骨架,并允许子类为一个或多个步骤提供实现. 模板方法使得子类在不改变算法结构的情况下,重新定义某些算法的步骤. 一次性实现一个算法不变的部分,把可变的行为留给子类实现. ...

  7. 玩转 ”hello word“，Python程序员大多数都没有实现过

    很多人学习Python很长时间,对于'hello word' 的认知,很多已经从事Python多年的程序员的认知也就只有: print(hello wrod) 但是有没有让hello word 变得不 ...

  8. python学习总结---学习交流群里的问题总结

    xml里面的过滤: <record id="action_partner_supplier_form_demo_ms" model="ir.actions.act_ ...

  9. Codechef TAPAIR Counting the important pairs 随机化、树上差分

    传送门 题意:给出一个$N$个点.$M$条边的无向连通图,求有多少组无序数对$(i,j)$满足:割掉第$i$条边与第$j$条边之后,图变为不连通.$N \leq 10^5 , M \leq 3 \ti ...

  10. iOS app签名原理

    基本原理: 公钥能够验证私钥的签名是否正确. Apple后台有一个私钥A,iOS内置一个公钥A,与私钥A对应.(A:代表Apple,即苹果) 本地产生一对公钥L.私钥L,(L:代表Local,即本地) ...