当在文本框中输入关键字,就会搜索出包含关键字的数据

实现:

只需要一个内容过滤即可

<body>
  <input type="text" id="searchbox"/>
  <table>
    <tbody>
      <tr>
        <td>aaa</td>
        <td>bbb</td>
      </tr>
      <tr>
        <td>bbb</td>
        <td>ccc</td>
      </tr>
    </tbody>
  </table>
  <script>
    $(function(){
      $('#searchbox').keyup(function(){
        $("table tbody tr").hide()
        .filter(":contains("+($(this).val())+")").show();//filter和contains共同来实现这个功能
      })
    })
  </script>
</body>

input keyup的时候实现内容过滤的更多相关文章

  1. jQuery选择器之内容过滤选择器Demo

    测试代码: 04-内容过滤选择器.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" &q ...

  2. 黑马day16 jquery&amp;内容过滤选择器&amp;可见度选择器

    内容过滤选择器的过滤规则主要体如今它所包括的子元素和文本内容上 .:contains(text) 使用方法: $("div:contains('John')")    返回值  集 ...

  3. Python Django开发中XSS内容过滤问题的解决

    from:http://stackoverflow.com/questions/699468/python-html-sanitizer-scrubber-filter 通过下面这个代码就可以把内容过 ...

  4. Jquery过滤选择器,选择前几个元素,后几个元素,内容过滤选择器等

    一.基本过滤选择器(重点掌握下列八个):first 选取第一个元素 $("div:first").css("color","red");:l ...

  5. [刘阳Java]_纯CSS代码实现内容过滤效果

    继续我们技术专题课,我们今天给大家带来的是一个比较酷炫的"纯CSS代码实现内容过滤效果",没有加入任何JS的效果.全部都是应用CSS3的新增选择器来实现的.先看效果截图 实现思路 ...

  6. JQuery 内容过滤选择器

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

  7. 灵玖软件Nlpir Parser语义智能内容过滤

    Internet是全球信息共享的基础设施,是一种开放和面向 所有用户的技术.它一方面要保证信息方便.快捷的共享;另一方面要防止垃圾信息的传播.网络内容分析是一种管理信 息传播的重要手段.它是网络信息安 ...

  8. jQuery内容过滤选择器与子元素过滤选择器用法实例分析

    jQuery选择器内容过滤 一.:contains(text) 选择器::contains(text)描述:匹配包含给定文本的元素返回值:元素集合 示例: ? 1 2 $("div.mini ...

  9. (7)Jquery1.8.3快速入门_内容过滤选择器

    一.Jquery的内容过滤选择器: 内容过滤选择器: 1.:contains(text) 选取含有文本内容为text的元素 2. :empty 选取不包含子元素或者文本为空的元素 3.:has(sel ...

随机推荐

  1. JavaScript 的异步和单线程

    问题 Q:下面的代码是否能满足sleep效果? var t = true; setTimeout(function(){ t = false; }, 1000); while(t){ } alert( ...

  2. 如何判断一个字符串是否是UTF8编码

    UTF8是以8bits即1Bytes为编码的最基本单位,当然也可以有基于16bits和32bits的形式,分别称为UTF16和UTF32,但目前用得不多,而UTF8则被广泛应用在文件储存和网络传输中. ...

  3. win10右击windows键没有反应解决方案(1707版本)

    按Win+R打开运行,输入“regedit”打开注册表编辑器. 2.在“HKEY_CLASSES_ROOT”主键下找到“linkfile”或者".lnkfile"字符串值项,在右侧 ...

  4. IO流对文件的读取操作

    /*1. 在当前项目的根目录下有一个名为“info.txt”的文件,里面存放的内容如下(可手动创建录入,不需要使用IO流): 2. 利用IO流的知识读取info.txt文件的内容, 在控制台上打印大写 ...

  5. python struct.pack中的对齐字节问题

    最近测试涉及到了序列字节化相关问题,碰到一个头疼的问题 buff = struct.pack("3s","B00")    print repr(buff) 输 ...

  6. Linux 终端命令行提示符的艺术--PS1进阶

    话不多说,先瞅瞅我的命令行提示符(有点大): 图中命令行解释:┌[阳历日期/农历日期 时间]├[当前目录下目录数+当前目录下文件数][当前绝对目录]└[用户名@主机名-第几个终端 ╰_╯] 相关配置文 ...

  7. 本地方法中printf如何传给java--java系统级命名管道

    本地方法中printf如何传给java--java系统级命名管道 摘自:https://blog.csdn.net/dog250/article/details/6007301 2010年11月13日 ...

  8. Entity Framework Tutorial Basics(9):Entity Relationships

    这篇前面已经转载出来了,地址:http://www.cnblogs.com/purplefox2008/p/5646466.html

  9. C#代码标识符命名规范

    总体原则:命名一定要体现其在程序中的作用: Camel命名法:第一个单词的首字母小写,其余每个单词的首字母大写:多用给变量或者字段命名:给字段命名必须以下划线开始: Pascal命名法:每个单词的首字 ...

  10. MySQL慢日志线上问题分析及功能优化

    本文来源于数据库内核专栏. MySQL慢日志(slow log)是MySQL DBA及其他开发.运维人员需经常关注的一类信息.使用慢日志可找出执行时间较长或未走索引等SQL语句,为进行系统调优提供依据 ...