table变色
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>鼠标滑过效果</title>
<script src="~/Scripts/jquery-1.10.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#orderedlist tbody tr").css({"text-align":"center"});
$("#orderedlist tbody tr").hover(function() {
$(this).addClass("blue");
}, function() {
$(this).removeClass("blue");
}).click(function ( ) {
// alert($(this).children("td").eq(0).attr("id"));//获取td
alert($(this).children("td").eq(1).text());//获取td
});
});
</script>
<style>
.blue {
background: #bcd4ec;
cursor: pointer;
}
</style>
</head>
<body>
<table id="orderedlist" width="50%" border="0" cellspacing="0" cellpadding="0">
<thead id="th1">
<tr>
<th>姓名</th>
<th>年龄</th>
<th>QQ</th>
<th>Email</th>
</tr>
</thead>
<tbody id="tb1">
<tr>
<td id="tid1">AAAA</td>
<td id="num1">20</td>
<td>1111</td>
<td>aaaa@gmail.com</td>
</tr>
<tr>
<td id="tid2">BBBB</td>
<td id="num2">21</td>
<td>2222</td>
<td>bbbb@gmail.com</td>
</tr>
<tr>
<td id="tid3">CCCC</td>
<td id="num3">22</td>
<td>333</td>
<td>cccc@gmail.com</td>
</tr>
</tbody>
</table>
</body>
</html>
table变色的更多相关文章
- 简单的css js控制table隔行变色
(1)用expression 鼠标滑过变色: <style type="text/css"><!-- table { background-color:#0000 ...
- css 实现table 隔行变色
<html> <head> <title>Member List</title> <style> <!-- .datalist{ bo ...
- jQuery实现table隔行换色和鼠标经过变色
一.隔行换色 $("tr:odd").css("background-color","#eeeeee"); $("tr:even& ...
- [原]点击按钮，表格隔行变色：偶数行为黄色背景，奇数行为默认颜色。通过table的getElementsByTagName取得所有的tr，依次遍历，如果是偶数就…………。
window.onload = function () { document.getElementById('btn').onclick = function () { ...
- table行随鼠标变色
table行随鼠标变色 1.设计表格 <body class="html_body"> <div class="body_div"> & ...
- GridView固定行宽,自动换行,鼠标放在Table的Tr上变色
//固定行宽table-layout:fixed;//自动换行word-break :break-all;word-wrap:break-wordGridView.Attributes.Add(&qu ...
- 关于table的td和ul元素li隔行变色的功能实现
table元素的td和ul元素li隔行变色的功能实现 利用css控制二者的样式轻松实现隔行换色: 例如:table的css样式控制: table tr td{ background-color:颜 ...
- 隔行变色---简单的css js控制table隔行变色
(1)用expression 鼠标滑过变色: <style type="text/css"><!-- table { background-color:#0000 ...
- 表格(Table)隔行变色
在ASP.NET的Repeater控件,实现隔行变色,是极简单的事情.因为它有ListItemType.Item和ListItemType.AlternatingItem模版.如果在普通的表格(Tab ...
随机推荐
- C# 进程间通信之二传递复杂数据类型（转）
从C#下使用WM_COPYDATA传输数据说到Marshal的应用 笔者曾在一个项目的实施过程中,需要使用WM_COPYDATA在本地机器的两个进程间传输数据.在C++中实现非常简单,但在C#中实现时 ...
- Disconf
通常我们会做如下配置:(disconf 2.6.21) <!-- 一次扫描 --> <bean id="disconfMgrBean" class="c ...
- Retina Display and Eclipse Mac视网膜屏和Eclipse
I have a Retina Display and Eclipse looks blurry. How can I fix it? You need to tell Mac OS that Ecl ...
- 72. Generate Parentheses && Valid Parentheses
Generate Parentheses Given a string containing just the characters '(', ')', '{', '}', '[' and ']', ...
- pip China
建个文件 ~/.pip/pip.conf, 内容如下 [global] index-url = http://b.pypi.python.org/simple [install] use-mirror ...
- winserver2008 R2 64位 企业版 , IIS 配置运行 asp+access 网站
新建网站,程序池由DefaultAppPool 改为 Classic .NET AppPool, 并在 高级设置中,把启用 32位应用程序 设为 true 对 access 所在目录新加 every ...
- 您只能在 HTML 输出流中使用 document.write。如果您在文档已加载后使用它（比如在函数中），会覆盖整个文档。
刚刚接触JS,看到这句话时一时没搞懂,想了终于有了一些眉目,意思就是在文档加载过后,如果我们用比方说按钮的方式重新加载文档,就会把文档都覆盖: 列如: <!DOCTYPE html> &l ...
- SetTimer 与 回调函数
在控制台应用程序中,SetTimer的函数原型为: UINT_PTR SetTimer( HWND hWnd, // handle to window UINT_PTR nIDEvent, // ti ...
- SQL语言基础
主要学习链接1 http://www.cnblogs.com/anding/p/5281558.html 搜索学习链接2 http://www.cnblogs.com/libingql/p/41342 ...
- 使用ab进行压力测试
在Windows系统的命令行下,进入ab.exe程序所在目录,执行ab.exe程序.注意直接双击无法正确运行.