`
dada_fangfang
  • 浏览: 144596 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
社区版块
存档分类
最新评论

jquery的筛选功能例子

阅读更多
首先引入jquery.js
js代码:
<script type="text/javascript">
  $(function(){
       $("#filterName").keyup(function(){ //filterName是文本框的id
          $("table tbody tr")
                    .hide()
                    .filter(":contains('"+( $(this).val() )+"')")
                    .show();
       }).keyup();
  })
</script>

<table>
    <thead>
        <tr><th>姓名</th><th>性别</th><th>暂住地</th></tr>
    </thead>
    <tbody>
        <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>
    </tbody>
</table>

当前页面,随意筛选,很好很强大啊!
分享到:
评论

相关推荐

    Jquery dataTable完整例子(分页,带文档)

    jQuery 的插件 dataTables 是一个优秀的表格插件,提供了针对表格的排序、浏览器分页、服务器分页、筛选、格式化等功能。 分页、排序、检索 Datatable与json之间数据转换,一个详细完整的例子!

    jquery实现多条件筛选特效

    jquery实现多条件筛选特效;里面有现成的例子;下载后就可以查看;和大家分享一下。jquery实现多条件筛选特效;里面有现成的例子;下载后就可以查看;和大家分享一下。

    jQuery例子包括三原色,筛选等

    一些例子:包括应用同一样式时会出现bug的解决方法,三元色,find标签筛选等

    jquery表格排序和筛选表

    一款依赖jquery实现表格排序和筛选表的例子。

    Jquery DataTables ASP.Net 详细例子

    jQuery 的插件 dataTables 是一个优秀的表格插件,提供了针对表格的排序、浏览器分页、服务器分页、筛选、格式化等功能。dataTables 的网站上也提供了大量的演示和详细的文档进行说明,但是官网是PHP的例子,特意做...

    jquery 仿模态对话框插件

    jquery selector: 以 content 指定的 jquery selector 筛选出第一个 jquery 对象的 HTML 文本. c. url: 以 iframe 加载 content 页面内容. 调用例子: $.modalbox.show({ modal: true, // 模态 contentType: ...

    jQuery权威指南-源代码

    《jQuery权威指南》不仅完整地呈现了jQuery本身所有的功能,而且讲解了jQuery UI等扩展功能;更值得一提的是,还包括最佳实践和性能优化方面的技巧,内容全面,结构合理。除此之外,本书还包括大量的实例,不仅每个...

    Jquery学习手册

    已经得到了一个jQuery对象,但是并不是想要的,那么可以通过一系列的跳转方法,比如parent()、next()、children()、find()等,或者过滤筛选的方法,比如eq()、filter()、not()等,来得到最终想要操作的jQuery对象。...

    jquery插件使用方法大全

    plugin历史版本1、新的事件.on() .off()3、动画的改进1.42版介绍JQuery插件让Dreamweaver支持提示代码功能引入JQuery展开编辑本段简介  jQuery由美国人John Resig创建,至今已吸引了来自世界各地的众多javascript...

    AjAX CSS 小例子

    自己搜集的一些小例子,希望能帮到大家

    JQuery&CSS;&CSS;+DIV实例大全.rar

    站长必备jquery实现combox自动筛选,高亮显示功能 4)菜单 1.jquery+CSS超炫丽横向多级滑动导航菜单 2.jQuery+CSS漂亮蓝色三级菜单下载 3.jquery+css实现简洁两级横向导航菜单,带动态效果 4.jQuery+CSS实现竖...

    jQuery详细教程

    下面是 jQuery 中事件方法的一些例子: Event 函数 绑定函数至 $(document).ready(function) 将函数绑定到文档的就绪事件(当文档完成加载时) $(selector).click(function) 触发或将函数绑定到被选元素的点击事件 $...

    三个基于jQuery的JS复选框全选反选例子

    摘要:脚本资源,jQuery,全选,反选 三个基于jQuery的JS复选框全选反选例子,实用的网页特效,三款例子大同小异。所有checkbox跟着全选的checkbox走,定义一个临时变量,避免重复使用同一个选择器选择页面中的元素,...

    jQuery+jRange数值范围选择控件

    本文用两个例子向大家介绍一款范围选择器插件jRange

    JQuery中根据属性或属性值获得元素(6种情况获取方法)

    在jQuery 中$(“”),这个语法等同于$(document.createElement(“span”)) ,这是一种用法,在选择元素的时候还会这样子的用:[attribute$=value],匹配给定的属性是以某些值结尾的元素。下面举个例子来说明一下: ...

    jQuery 网站分类插件 带动画效果.rar

    jQuery带特效的网页内容分类插件,举个例子来说,如果你网页上显示有各种分类的图片,用户想把同一分类的图片筛选出来显示,这时候就要用到这个插件了,它可把内容按不同的分类显示出来,在显示过程中附加动画效果,...

    基于jQuery的表格操作插件

    今天彬Go将向大家推荐15个jQuery表格插件让你对数据表格进行显示、排序、筛选和操控。如jQuery表格排序插件、jQuery表格拖拽插件、jQuery树形表格插件、设置颜色、点击、替换等效果。 1.DataTables-强大的jQuery...

    怎样判断jQuery当前元素是隐藏还是显示

    is挺好用的,他能够用jQuery选择器作为参数,特别是跟jQuery里面的选择器里面那些以冒号开头的筛选符配合使用,实现各种各样的判断。如: “:checked,:hidden”等等。给个例子: &lt;head&gt; [removed][removed] ...

    jQuery siblings()用法实例详解

    jQuery 的遍历方法siblings() $(给定元素).siblings(.selected) 其作用是筛选给定的同胞同类元素(不包括给定元素本身) 例子:网页选项栏 当点击任意一个选项卡是,其他2个选项卡就会改变样式,其内容也会隐藏...

Global site tag (gtag.js) - Google Analytics