示例:

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

1、隔行变色:
CSS代码:
.even{background:red};
.odd{background:green};
然后分别给奇偶行添加样式如下:
$(function(){
  $("tr:even").addClass(even);
  $("tr:odd").addClass(odd);
});
上述代码会吧表头也算进去,这里需要排除表头<thread>中的<tr>,如下:
$(function(){
  $("<tbody>tr:even").addClass(even);
  $("<tbody>tr:odd").addClass(odd);
});
如果需要对选中行执行高亮,如下:
$("tr:contains('张三')").addClass("selected");

2、内容筛选
例如要筛选出含有文本“李”的表格行:
$(function(){
  $("table tbody tr").hide()
  filter(":contains('李')").show();
});
所以,文本框中输入“李”时,就会筛选出相应的表格行,执行代码如下:
$(function(){
  $("filterName").keyup(function(){
    $("table tbody tr").hide()
    filter(":contains('"+($(this).val())+"')").show();
  }).keyup();
});

jQuery应用操作之---表格的更多相关文章

  1. 关于jquery简单操作简单表格

    最近在摸索jquery中,想着学习过程中还是记下点自己的东西比较好,不管是日后自己查阅,亦或是对于他人有些许帮助. 也是一件两全其美的事情了. 下面我就简单 贴上自己的html中重要部分了. 具体实现 ...

  2. jQuery(6)——jQuery对表单、表格的操作及更多应用

    jQuery对表单.表格的操作及更多应用 [表单应用] 一个表单有表单标签.表单域及表单按钮三个基本部分. 单行文本框应用:获取和失去焦点改变样式. 也可以用CSS中的伪类选择符来实现,但是IE6并不 ...

  3. jQuery 对表单、表格的操作及更多应用-简略笔记

    [jQuery 对表单.表格的操作及更多应用] jquery对表单及表格的操作是实际应用中相当广泛. 对于表单的操作,可以实现 (1)获取和失去焦点改变样式: (2)在多行文本框中可以实现网站评论框的 ...

  4. 转:jQuery 常见操作实现方式

    http://www.cnblogs.com/guomingfeng/articles/2038707.html 一个优秀的 JavaScript 框架,一篇 jQuery 常用方法及函数的文章留存备 ...

  5. jQuery 常见操作实现方式

    一个优秀的 JavaScript 框架,一篇 jQuery 常用方法及函数的文章留存备忘. jQuery 常见操作实现方式 $("标签名") //取html元素 document. ...

  6. JQuery常用操作实现方式

    http://www.cnblogs.com/guomingfeng/articles/2038707.html 一个优秀的 JavaScript 框架,一篇 jQuery 常用方法及函数的文章留存备 ...

  7. jQuery——能够编辑的表格

    版权声明:欢迎转载,请注明出处 https://blog.csdn.net/suneqing/article/details/26856635     今天学习了利用jQuery实现能够编辑的表格这个 ...

  8. jQuery其他操作与bootstrap框架

    目录 标签操作 样式操作 位置操作 文本值操作 属性操作 文档处理 事件操作 常见事件 克隆案例 悬浮事件hover() 监听input输入值事件 阻止后续事件 事件委托 动画效果 bootstrap ...

  9. JavaScript jQuery 中定义数组与操作及jquery数组操作

    首先给大家介绍javascript jquery中定义数组与操作的相关知识,具体内容如下所示: 1.认识数组 数组就是某类数据的集合,数据类型可以是整型.字符串.甚至是对象Javascript不支持多 ...

随机推荐

  1. 使用quartz实现不重启服务器修改自定义配置

    为了方便维护系统,开发中通常会设置一些自定义参数,写在单独的配置文件里,需要调整时可直接登录服务器修复配置文件,而不需要修改程序.但尴尬的是,web服务器并不会自动重新加载配置文件,重启服务器又会中断 ...

  2. 从头开始基于Maven搭建SpringMVC+Mybatis项目(3)

    接上文内容,本节介绍基于Mybatis的查询和分页功能,并展示一个自定义的分页标签,可重复使用以简化JSP页面的开发. 从头阅读传送门 在上一节中,我们已经使用Maven搭建好了项目的基础结构,包括一 ...

  3. 排序算法的实现(C/C++实现)

    存档: #include <iostream> #include <stdlib.h> #include <sort.h> #define maxsize 20 u ...

  4. bzoj:3994:vijos1949: [SDOI2015]约数个数和

    Description  设d(x)为x的约数个数,给定N.M,求     Input 输入文件包含多组测试数据. 第一行,一个整数T,表示测试数据的组数. 接下来的T行,每行两个整数N.M.   O ...

  5. [51nod1610]路径计数

    路径上所有边权的最大公约数定义为一条路径的值. 给定一个有向无环图. T次修改操作,每次修改一条边的边权,每次修改后输出有向无环图上路径的值为1的路径数量(对1,000,000,007取模). Inp ...

  6. [20160711][neven代码移植Windows]

    相关说明 neven代码用于人脸检测,该代码是从Android源代码中抽取出来的,可以在Linux系统下通过make命令直接进行编译,并且可以通过代码中opencv目录下的测试文件进行测试. 移植环境 ...

  7. Unity LayerMask

    Unity用int32的每一位表示32个层,int32用二进制有32位,Layers通常被摄像机用来渲染部分场景,和灯光照射部分场景使用.但是它们也可以用来做射线检测时忽略一些collder或Coll ...

  8. 邓_phpcms_数据库

    phpcms v9 数据表结构 在线版 PHPCMS V9 数据结构 (2010-12-28) 表 1 : v9_admin 管理员表 字段 类型 Null 默认 额外 注释 userid mediu ...

  9. As a Start - 毫厘之间,宇宙之外

    序 突然想聊聊多重宇宙——多重宇宙,这听上去像是一个科幻概念,但是严肃思考这一个问题时,将会带我们进入一个全新的格局和世界. 对宇宙学家而言,研究多重宇宙并不仅仅是为了猜测平行世界里某一历史事件是否有 ...

  10. ADO.NET复习总结(6)-断开式数据操作

    一.基础知识 主要类及成员(和数据库无关的)(1)类DataSet:数据集,对应着库,属性Tables表示所有的表(2)类DataTable:数据表,对应着表,属性Rows表示所有的行(3)类Data ...