jQuery实现table隔行换色和鼠标经过变色
一、隔行换色
$("tr:odd").css("background-color","#eeeeee");
$("tr:even").css("background-color","#ffffff");
或者一行搞定:
$("table tr:nth-child(odd)").css("background-color","#eeeeee");
:nth-child 匹配其父元素下的第N个子或奇偶元素
二、鼠标经过变色
$("tr").live({
mouseover:function(){
$(this).css("background-color","#eeeeee");
},
mouseout:function(){
$(this).css("background-color","#ffffff");
}
})
或者
$("tr").bind("mouseover",function(){
$(this).css("background-color","#eeeeee");
})
$("tr").bind("mouseout",function(){
$(this).css("background-color","#ffffff");
})
当然live()和bind()都可以同时绑定多个事件或分开。
如果table表格是动态添加的 请参阅:http://blog.csdn.net/itmyhome1990/article/details/30245973
jQuery实现table隔行换色和鼠标经过变色的更多相关文章
- jQuery实现表格隔行换色且感应鼠标高亮行变色
jQuery插件实现表格隔行换色且感应鼠标高亮行变色 http://www.jb51.net/article/41568.htm jquery 操作DOM的基本用法分享http://www.jb51. ...
- JQuery 表格 隔行换色 和鼠标滑过的样式
$(document).ready(function () { $(".Pub_TB tbody tr:even td").css("background-color&q ...
- table隔行换色
以前做表格隔行换色,是在tr上添加不同的背景色,但在程序开发的过程需要做判断,不够方便,而且生成的代码也比较多,现在的需求逐渐修改为JQ去控制简洁的表格去显示隔行换色 <script type= ...
- JS给TR隔行换色,鼠标经过有动感
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DT ...
- js实现表单的隔行换色、鼠标高亮出来等相关内容以及相关事件的作用
主要是使用的onload().onmouseover和onmouseout的相关应用,满足此次的相关操作. 具体的相关的两个代码如下: <!DOCTYPE html> <html&g ...
- jQuery学习(四)——使用JQ完成表格隔行换色
1.步骤分析: 第一步:引入jquery的类库 第二步:直接写页面加载函数 第三步:直接使用jquery的选择器(组合选择)拿到需要操作的元素(奇数行和偶数行) 第四步:分别使用CSS的方法(css( ...
- jQuery_完成表格的隔行换色
表格的颜色一样不利于区分,而利用jQuery则可以很方便的进行表格的隔行换色操作,原表如下: 这样看着很不方便,但是隔行换色之后非常便捷清楚. 代码如下: <!DOCTYPE html> ...
- JS实现自定义工具类,隔行换色、复选框全选、隔行高亮等
很多功能都可以放在js的工具类中,在使用的时候直接调用 本次实现的功能包括: /** 0.当点击表的整行的任意位置时,第一列的复选框或者单选框均选中 1.隔行换色 2.复选框的全选效果 3.实现表格 ...
- jQuery插件实现表格隔行换色且感应鼠标高亮行变色
实现表格隔行换色,且感应鼠标行变色的方法有很多,在本文将为大家介绍的是使用jQuery插件来实现,具体如下 看代码: : css代码:
随机推荐
- Spring + Spring MVC + Hibernate
Spring + Spring MVC + Hibernate项目开发集成(注解) Posted on 2015-05-09 11:58 沐浴未来的我和你 阅读(307) 评论(0) 编辑 收藏 在自 ...
- Ubuntu14.04安装一个小问题,搜狗输入法
罕见的搜狗输入法支持ubuntu.尝试了决定性下载. 官方网站:http://pinyin.sogou.com/linux/ 官网教程:http://pinyin.sogou.com/linux/he ...
- ZOJ3640之简单慨率DP
Help Me Escape Time Limit: 2 Seconds Memory Limit: 32768 KB Background If thou doest well, ...
- Lucene.Net简介和分词
Lucene.net站内搜索—2.Lucene.Net简介和分词 2015-03-24 23:10 by 邹琼俊, 118 阅读, 1 评论, 收藏, 编辑 Lucene.Net简介 Lucene.N ...
- jQuery邮箱验证正则表达式验证邮箱合法
if($.trim(email)==''||$.trim(email)=='邮 箱:'||$.trim(email)==null){ alert('邮箱不能为空!'); return false ...
- openwrt路由器更换了Flash之后需要修改的源码
假如我使用的是WR703N,改为8M内存: 1 修改openwrt/target/linux/ar71xx/image/Makefile文件 $(eval $(call SingleProfile,T ...
- datagridcolumn单元格怎么显示查询到的某个表的字段值(字段值可能为多个)
例如,在之前做的项目中,查询mhz_xckcr表,select出某个业务的现场勘察人信息,select出的现场勘察人姓名(可能有多个)要在前台datagrid的一个datagridcolmn单元格显示 ...
- 【Web.xml配置具体解释之context-param
】
转自:http://blog.csdn.net/liaoxiaohua1981/article/details/6759206 格式定义: [html] view plaincopy <cont ...
- css-缩写
border缩写 /*缩写前*/ element{ border-top-width:1px; border-top-style:solid; border-top-color:#cccccc; } ...
- .NET MVC4 实训记录之五(访问自定义资源文件)
.Net平台下工作好几年了,资源文件么,大多数使用的是.resx文件.它是个好东西,很容易上手,工作效率高,性能稳定.使用.resx文件,会在编译期动态生成已文件名命名的静态类,因此它的访问速度当然是 ...