$(document).ready(function () {

    $(".Pub_TB tbody tr:even td").css("background-color", "#dbdbdb"); //隔行换色

    /*************/
//鼠标滑过的样式
$(".Pub_TB tbody tr:odd ").attr("bg", "#e8e8e8");
$(".Pub_TB tbody tr:even").attr("bg", "#dbdbdb"); $(".Pub_TB tbody tr td").mouseover(function () {
$(this).parent().find("td").css("background-color", "#bdb9b9");
});
$(".Pub_TB tbody tr td").mouseout(function () {
var bgc = $(this).parent().attr("bg");
$(this).parent().find("td").css("background-color", bgc);
}); /*************/ })
<table class="Pub_TB">
<tr>
<th style="width:5%">序号</th>
<th>项目名称</th>
<th style="width:10%">送报月份</th>
<th style="width:15%">送报状态</th>
<th style="width:20%">提醒方式</th>
<th style="width:15%">管理</th>
</tr>
<tbody>
<tr>
<td>01</td>
<td>川南步行街</td>
<td>2016.01.01</td>
<td></td>
<td><span>短信提醒</span><span>邮箱提醒</span></td>
<td class="oper"><a href="">[查看]</a>
<a href="">[修改]</a>
<a href="">[报送]</a></td>
</tr>
<tr>
<td>01</td>
<td>川南步行街</td>
<td>2016.01.01</td>
<td></td>
<td><span>短信提醒</span><span>邮箱提醒</span></td>
<td class="oper"><a href="">[查看]</a>
<a href="">[修改]</a>
<a href="">[报送]</a></td>
</tr>
<tr>
<td>01</td>
<td>川南步行街</td>
<td>2016.01.01</td>
<td></td>
<td><span>短信提醒</span><span>邮箱提醒</span></td>
<td class="oper"><a href="">[查看]</a>
<a href="">[修改]</a>
<a href="">[报送]</a></td>
</tr>
</tbody>
</table>

注意tbody

JQuery 表格 隔行换色 和鼠标滑过的样式的更多相关文章

  1. jQuery表格隔行换色和全选的实现

    1.下载jQuery,并导入:https://blog.csdn.net/weixin_44718300/article/details/88746796 2.代码实现: <!DOCTYPE h ...

  2. jQuery实现表格隔行换色且感应鼠标高亮行变色

    jQuery插件实现表格隔行换色且感应鼠标高亮行变色 http://www.jb51.net/article/41568.htm jquery 操作DOM的基本用法分享http://www.jb51. ...

  3. jQuery插件实现表格隔行换色且感应鼠标高亮行变色

    实现表格隔行换色,且感应鼠标行变色的方法有很多,在本文将为大家介绍的是使用jQuery插件来实现,具体如下 看代码: : css代码:  

  4. JQuery案例一:实现表格隔行换色

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  5. jQuery应用实例2:表格隔行换色

    这里是用JS实现的:http://www.cnblogs.com/xuyiqing/p/8376312.html 接下来利用上一篇提到的选择器利用jQuery实现: 发现原来多行代码这里只需要两行: ...

  6. jQuery学习(四)——使用JQ完成表格隔行换色

    1.步骤分析: 第一步:引入jquery的类库 第二步:直接写页面加载函数 第三步:直接使用jquery的选择器(组合选择)拿到需要操作的元素(奇数行和偶数行) 第四步:分别使用CSS的方法(css( ...

  7. JS应用实例4:表格隔行换色

    HTML代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <t ...

  8. js实现表单的隔行换色、鼠标高亮出来等相关内容以及相关事件的作用

    主要是使用的onload().onmouseover和onmouseout的相关应用,满足此次的相关操作. 具体的相关的两个代码如下: <!DOCTYPE html> <html&g ...

  9. table 表格隔行换色实现

    table 表格隔行换色实现 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "htt ...

随机推荐

  1. WPF 之 TreeView右键选中节点及节点重命名

    下面的TreeView节点是通过数据双向绑定的方式,绑定到TextBlock控件和TextBox控件的Text属性上,并且让两者绑定相同的属性,同时使TextBox控件刚好完全覆盖TextBlock控 ...

  2. shell 获取cpu使用率

    1.shell脚本获取主机每颗CPU使用率的方法. #!/bin/bash interval= cpu_num=`-] -c` start_idle=() start_total=() cpu_rat ...

  3. Android 高级UI设计笔记19:PopupWindow使用详解

    1. PopupWindow使用 PopupWindow这个类用来实现一个弹出框,可以使用任意布局的View作为其内容,这个弹出框是悬浮在当前activity之上的. 2. PopupWindow使用 ...

  4. TCP/IP协议原理与应用笔记24:网际协议(IP)之 IP协议的简介

    1. IP协议:(网际协议) 2. IP协议(不可靠无连接数据报协议) (1)连接 vs. 可靠性 连接:面向连接.无连接 可靠:差错控制.流量控制等 面向连接不一定保证可靠,无连接不一定不可靠 在连 ...

  5. 【阿里云产品公测】ACE安装Discuz超详细图文教程

    作者:阿里云用户51干警网 hello.今天我们来在阿里云ACE上安装discuz. 因为本人不喜欢X3.2的版本,这次我使用的是DZX2.5. 首先的是准备工作: 一.申请阿里云ACE内测 http ...

  6. 明风:分布式图计算的平台Spark GraphX 在淘宝的实践

    快刀初试:Spark GraphX在淘宝的实践 作者:明风 (本文由团队中梧苇和我一起撰写,并由团队中的林岳,岩岫,世仪等多人Review,发表于程序员的8月刊,由于篇幅原因,略作删减,本文为完整版) ...

  7. 《算法导论》习题解答 Chapter 22.1-5(求平方图)

    一.邻接矩阵实现 思路:如果是邻接矩阵存储,设邻接矩阵为A,则A*A即为平方图,只需要矩阵相乘即可: 伪代码: for i=1 to n for j=1 to n for k=1 to n resul ...

  8. String类的方法2

    ---恢复内容开始--- .ToLower()    //转为小写字符串"AbC"-->"abc" .ToUpper()    //转为大写"A ...

  9. VMware系统运维(十四)部署虚拟化桌面 Horzion View Manager 5.2 配置许可

    1.通过网页访问https://conntionserver.testad.local/admin,打开如下图所示页面:输入用户名密码 2.进来以后配置View 许可,点击"编辑许可证&qu ...

  10. JAVA备忘录

    本文主要是记录一下JAVA: 1.Arrays.的几个用法: fill:数组全部置一个数 sort:排序 binarySearch:二分查找 2.Map的用法: Map<Integer,Inte ...