如何实现table中,点击某行,选中某行,改变其背景色
2015-08-19 08:33
232 查看
1、首先,现在你的文件中导入 jquery.js 文件
2、在<script></script>中添加如下代码
$("#table1 tr").click(function(){
document.getElementById("oddNum").value = this.id; //每行设置不同的id值,该行是获取当前行的唯一值
$(this).addClass("backcolor").siblings("tr").removeClass("backcolor"); //这行是进行背景色的切换,backcolor 是提前定义好的外部css样式,这里进行添加与删除同类的,即实现了选中改行,其他行颜色去掉。 backcolor 中的属性 要加上 !important ,提高其优先级
$(this).siblings("tr").find("td").removeClass("backcolor_font"); //下边两行是修改该tr中的字体颜色,该行的作用是删除样式
$(this).find("td").addClass("backcolor_font"); //该行是添加样式,因为想要实现的效果是点击某行,字体颜色切换,只有一行的字体颜色改变
});
2、在<script></script>中添加如下代码
$("#table1 tr").click(function(){
document.getElementById("oddNum").value = this.id; //每行设置不同的id值,该行是获取当前行的唯一值
$(this).addClass("backcolor").siblings("tr").removeClass("backcolor"); //这行是进行背景色的切换,backcolor 是提前定义好的外部css样式,这里进行添加与删除同类的,即实现了选中改行,其他行颜色去掉。 backcolor 中的属性 要加上 !important ,提高其优先级
$(this).siblings("tr").find("td").removeClass("backcolor_font"); //下边两行是修改该tr中的字体颜色,该行的作用是删除样式
$(this).find("td").addClass("backcolor_font"); //该行是添加样式,因为想要实现的效果是点击某行,字体颜色切换,只有一行的字体颜色改变
});
相关文章推荐
- UI初级第六课  Tab 控制器(标签控制器)——iOS学习连载21
- 计算机视觉CV 之 CMT跟踪算法分析二
- python闭包详解+实例演示
- UI初级第五课  导航控制器——iOS学习连载20
- anroid 点击图形缩小
- 必须掌握的排序
- OC: 类的扩展、类的延展、协议、 NSDate
- UITouch触摸与手势
- 3.3内容提供者ContentProvider,供其他软件访问本软件的数据操作
- 子类继承父类(父类和子类里:块、静态块、构造和方法覆写)之间调用顺序
- 单例——iOS学习连载19
- java的队列
- 2015 HUAS Summer Trainning #6~I
- 广佛肇城轨年内通车 佛山西站预计2017年中通车
- 广佛肇城轨年内通车 佛山西站预计2017年中通车
- 消息队列是先进先出
- iOS开发 自定义UICollectionViewLayout实现Masonry Layout
- Spring 的下载、安装和使用
- 高进度乘法FFT优化
- C++:STL标准入门汇总