示例:

<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. python对pywifi模块的认识

    pywifi是一个用来搞wifi的模块 下一章我们将用他破解wifi密码 pywifi安装 pip install pywifi 下列代码判断是否有无限网卡 import pywifi import ...

  2. 如何让一个DIV水平,垂直方向都居中于浏览器?

    <style type="text/css"><!-- div {position:absolute;top:50%;left:50%;margin:-150px ...

  3. vijos 1942 [AH 2005] 小岛

    描述 西伯利亚北部的寒地,坐落着由 N 个小岛组成的岛屿群,我们把这些小岛依次编号为 1 到 N . 起初,岛屿之间没有任何的航线.后来随着交通的发展,逐渐出现了一些连通两座小岛的航线.例如增加一条在 ...

  4. [bzoj1700]: [Usaco2007 Jan]Problem Solving 解题

    不能贪心!不能贪心!不能贪心! 反正有反例(有的题目月初支付款很少,月末支付款很大,和前面的题凑到一个月的话可能导致下个月写不了= =这时放后一个月,和后面的题一起开始写可能更优) 比如: 50 44 ...

  5. NowCoderWannafly挑战赛5-可编程拖拉机比赛-向上取整和向下取整函数

    可编程拖拉机比赛 时间限制:C/C++ 1秒,其他语言2秒空间限制:C/C++ 65536K,其他语言131072K64bit IO Format: %lld 题目描述 "这个比赛,归根结底 ...

  6. enum与typedef enum

    enum与typedef enum的用法 在程序中,可能需要为某些整数定义一个别名,我们可以利用预处理指令#define来完成这项工作,您的代码可能是: #define MON  1#define T ...

  7. ucosii --任务就绪表

    任务就绪表的任务就是高效的找出当前优先级最高的就绪任务. 由任务就绪表OSRdyTbl和任务就绪组OSRdyGrb组成,OSRdyTbl每一个位都记录着一个任务的就绪状态, 0非就绪1就绪,OSRdy ...

  8. 前端通信:SSE设计方案(二)--- 服务器推送技术的实践以及一些应用场景的demo(包括在线及时聊天系统以及线上缓存更新,代码热修复案例)

    距离上一篇博客,这篇文章的发布大概过了整整三个月.我也从饿了么度过了试用期,成为了正式员工.刚进来恰好遇到项目底层改造和迁移,将项目从angular全部迁移到vue上,所以适应这边的节奏和业务的开发任 ...

  9. visual studio 打开微软MVC3示例MvcMusicStore的详细修改方法

    1.官方下载地址:http://mvcmusicstore.codeplex.com/ 2.直接打开项目后,引用中会有三个dll文件报错,分别是System.Web.MVC;System.Web.He ...

  10. 从零开始学习前端开发 — 1、HTML基础

    一.web标准 web标准-网页制作的标准,它是由一系列标准组成的,主要包含三个方面:结构(html,xhtml),表现(css),行为(javascript) 注:结构和表现的标准由w3c(万维网联 ...