table中 点击某一行变色
效果图:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<script language="javascript" type="text/javascript">
function tagscheck(a) {
var lng = document.getElementsByTagName("tr").length;
for (i = 0; i < lng; i++) {
var temp = document.getElementsByTagName("tr")[i];
if (a == temp) {
//选中的标签样式
temp.style.background = "#ccc";
} else {
//恢复原状
temp.style.background = "";
}
}
}
</script>
</head>
<body>
<table width="100%" border="1" cellpadding="2" cellspacing="0">
<tbody>
<tr>
<td bgcolor="#006600">dd </td>
<td bgcolor="#006600"> dd</td>
<td bgcolor="#006600">dd </td>
</tr>
<tr onclick="tagscheck(this);">
<td> 2</td>
<td>3 </td>
<td>4 </td>
</tr>
<tr onclick="tagscheck(this);">
<td> 45</td>
<td>456 </td>
<td>46 </td>
</tr>
<tr onclick="tagscheck(this);">
<td> 3</td>
<td>3 </td>
<td>45 </td>
</tr>
<tr onclick="tagscheck(this);">
<td> 67</td>
<td>7 </td>
<td>s </td>
</tr>
<tr onclick="tagscheck(this);">
<td>d </td>
<td> a</td>
<td>s </td>
</tr>
<tr onclick="tagscheck(this);">
<td> s</td>
<td> d</td>
<td>s </td>
</tr>
</tbody>
</table>
</body>
</html>
参考资料
table中 点击某一行变色的更多相关文章
- 点击table中的某一个td,获得这个tr的所有数据
功能: 点击table中的某一个td,获得这个tr的所有数据 效果图 <html> <head> <script> function getData2(elemen ...
- table中tr或者td的点击事件
直接把时间添加到table或者tbody上,只有下面的tr或者td才能促发事件,通过e.target可以获得当前点击tr或者td,这样就可以进行查询或者删除操作了 如果是删除,直接e.target.r ...
- js操作table中tr的顺序，实现上移下移一行的效果
总体思路是在table外部加个div,修改div的innerHtml实现改变tr顺序的效果 具体思路是 获取当前要移动tr行的rowIndex,在table中删除掉,然后循环table的rows,到了 ...
- JS实现table表格在鼠标移动出现一行变色或者十字叉变色
1,一行变色 <script> function trBg(){ var tab=document.getElementById("table"); var tr=ta ...
- js Table表格选中一行变色或者多选 并获取值
使用JQ <script> let old, oldColor; $("#sp_body tr").click(function (i) { if (old) oldC ...
- Bootstrap Table 中文文档（完整翻译版）
表格参数: 名称 标签 类型 默认 描述 - data-toggle String ‘table’ 不用写 JavaScript 直接启用表格. classes data-classes String ...
- 选中repeater表格中的一行使其变色
//table表中点击行,选中的那一行颜色会变成浅蓝色(颜色可以自己设定) //其中sellerTable 为table的id, $("#sellerTable tbody tr" ...
- js穿梭框；将两个table中的数据选中移动
将table中选中的数据移动到右边: 点击一行中的任意一个位置,使其选中: 注:attr()和prop()都是jquery的方法: .attr() : 获取匹配的元素集合中的第一个元素的属性的值 或 ...
- Java&Selenium处理页面Table以及Table中随机位置的数据
一.摘要 前一段时间公司小伙伴刚刚接触自动化,遇到的一个问题,页面新创建的数据保存后,出现在table中的某个位置,并不一定是第一行还是第几行,这种情况下如何去操控它 本篇博文将介绍处理这个问题的一种 ...
随机推荐
- Scala：集合类型Collection和迭代器
http://blog.csdn.net/pipisorry/article/details/52902549 Scala Collection Scala 集合分为可变的和不可变的集合. 可变集合可 ...
- springMVC源码分析--HandlerMethod
在之前的博客中我们已经接触过HandlerMethod,接下来我们简单介绍一下HandlerMethod,简单来说HandlerMethod包含的信息包括类.方法和参数的一个信息类,通过其两个构造函数 ...
- Web自动化框架LazyUI使用手册（5）--模板工程：LazyUI-template详解
概述: LazyUI-template: 提供Maven管理的,基于Spring+Testng的,包含常用浏览器driver的,方便连接各种数据库的java模板工程,并提供以百度搜索为例的第一个测试用 ...
- [ExtJS5学习笔记]第三十三节 sencha extjs 5 grid表格导出excel
使用extjs肯定少不了使用表格控件,用到表格,领导们(一般)还是惯于使用excel看数据,所以用到extjs表格的技术猿们肯定也会有导出表格excel这一个需求,本文主要针对如何在用extjs将gr ...
- Android必知必会-发布开源 Android 项目注意事项
如果移动端访问不佳,请使用 –> Github版 1. 合理配置 .gitignore 文件 配置 .gitignore 可以排除一些非必要文件和保护保密信息,下面是在项目根目录下 .gitig ...
- CoreAnimation动画结构变量
大熊猫猪·侯佩原创或翻译作品.欢迎转载,转载请注明出处. 如果觉得写的不好请多提意见,如果觉得不错请多多支持点赞.谢谢! hopy ;) 免责申明:本博客提供的所有翻译文章原稿均来自互联网,仅供学习交 ...
- 剑指Offer——小米+小红书笔试题+知识点总结
剑指Offer--小米+小红书笔试题+知识点总结 情景回顾 时间:2016.9.23 19:00-21:00 2016.9.24 15:00-17:00 地点:山东省网络环境智能计算技术重点实验室 事 ...
- x264源代码简单分析：宏块分析（Analysis）部分-帧内宏块（Intra）
===================================================== H.264源代码分析文章列表: [编码 - x264] x264源代码简单分析:概述 x26 ...
- Java学习之控制跳转语句
控制跳转语句 控制跳转语句: (1)break:中断的意思 A:用在循环和switch语句中,离开此应用场景无意义. B:作用 a:跳出单层循环 b:跳出多层循环,需要标签语句的配合 (2)conti ...
- hive元数据库表分析及操作
在安装Hive时,需要在hive-site.xml文件中配置元数据相关信息.与传统关系型数据库不同的是,hive表中的数据都是保存的HDFS上,也就是说hive中的数据库.表.分区等都可以在HDFS找 ...