jQuery实现table隔行换色和鼠标经过变色的两种方法


Posted in Javascript onJune 15, 2014

一、隔行换色

$("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()都可以同时绑定多个事件或分开。
Javascript 相关文章推荐
select组合框option的捕捉实例代码
Sep 30 Javascript
div移动 输入框不能输入的问题
Nov 19 Javascript
javascript写的简单的计算器,内容很多,方法实用,推荐
Dec 29 Javascript
基于jquery的可多选的下拉列表框
Jul 20 Javascript
js操作CheckBoxList实现全选/反选(在客服端完成)
Feb 02 Javascript
js给页面加style无效果的解决方法
Jan 20 Javascript
使用AOP改善javascript代码
May 01 Javascript
jquery实现移动端点击图片查看大图特效
Sep 11 Javascript
基于jQuery的Web上传插件Uploadify使用示例
May 19 Javascript
深入浅析JavaScript中的scrollTop
Jul 11 Javascript
node.js实现快速截图
Aug 27 Javascript
详解React路由传参方法汇总记录
Nov 29 Javascript
jQuery 过滤方法filter()选择具有特殊属性的元素
Jun 15 #Javascript
Javascript实现简单二级下拉菜单实例
Jun 15 #Javascript
jQuery $.extend()用法总结
Jun 15 #Javascript
解决自定义$(id)的方法与jquery选择器$冲突的问题
Jun 14 #Javascript
使用jQuery判断IE浏览器版本的代码
Jun 14 #Javascript
jQuery Migrate 1.1.0 Released 注意事项
Jun 14 #Javascript
zeroclipboard 单个复制按钮和多个复制按钮的实现方法
Jun 14 #Javascript
You might like
《Re:从零开始的异世界生活 冰结之绊》
2020/04/09 日漫
PHP 和 MySQL 基础教程(二)
2006/10/09 PHP
php 生成饼图 三维饼图
2009/09/28 PHP
PHP 基于文件头的文件类型验证类函数
2012/05/01 PHP
探讨:使用XMLSerialize 序列化与反序列化
2013/06/08 PHP
深入PHP autoload机制的详解
2013/06/09 PHP
php实现TCP端口检测的方法
2015/04/01 PHP
老生常谈PHP位运算的用途
2017/03/12 PHP
PHP简单实现二维数组赋值与遍历功能示例
2017/10/19 PHP
javascript cookies 设置、读取、删除实例代码
2010/04/12 Javascript
基于jQuery的图片大小自动适应实现代码
2010/11/17 Javascript
jQuery1.6 使用方法一
2011/11/23 Javascript
javascript正则表达式中的replace方法详解
2015/04/20 Javascript
移动端H5开发 Turn.js实现很棒的翻书效果
2016/06/20 Javascript
基于vue2.0的活动倒计时组件countdown(附源码下载)
2018/10/09 Javascript
jQuery利用FormData上传文件实现批量上传
2018/12/04 jQuery
Vue中el-form标签中的自定义el-select下拉框标签功能
2020/04/20 Javascript
VSCode搭建Vue项目的方法
2020/04/30 Javascript
vuex的使用和简易实现
2021/01/07 Vue.js
Python中的闭包详细介绍和实例
2014/11/21 Python
Python的装饰器用法学习笔记
2016/06/24 Python
Python sqlite3事务处理方法实例分析
2017/06/19 Python
使用python 和 lint 删除项目无用资源的方法
2017/12/20 Python
Keras-多输入多输出实例(多任务)
2020/06/22 Python
卸载tensorflow-cpu重装tensorflow-gpu操作
2020/06/23 Python
Python打印不合法的文件名
2020/07/31 Python
CSS3 border-image详解、应用及jQuery插件
2011/08/29 HTML / CSS
米兰必去买手店排行榜首位:Antonioli
2016/09/11 全球购物
Agoda香港:全球特价酒店预订
2017/05/07 全球购物
劳动实践课感言
2014/02/01 职场文书
培训班开班仪式主持词
2014/03/28 职场文书
社区戒毒工作方案
2014/06/04 职场文书
社区安置帮教工作总结2015
2015/05/20 职场文书
尼克胡哲观后感
2015/06/08 职场文书
2016优秀毕业生个人事迹材料
2016/02/29 职场文书
微信小程序和php的登录实现
2021/04/01 PHP