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 ...
随机推荐
- 安装lxml时gcc: internal compiler error: Killed (program cc1)的解决方法
在安装lxml时出现如下错误 gcc: internal compiler error: Killed (program cc1) 通过查看dmesg发现下述错误信息[2517343.500178] ...
- JQuery 上传文件插件 Uploadify1
基于jquery的文件上传控件,支持ajax无刷新上传,多个文件同时上传,上传进行进度显示,删除已上传文件. <link href="~/Content/themes/uploadif ...
- 关于Spring
Jetty默认采用NIO结束在处理I/O请求上更占优势,在处理静态资源时,性能较高.Tomcat默认采用BIO处理I/O请求,在处理静态资源时,性能较差. 依赖注入的意义:让组件依赖于抽象,当组件要与 ...
- dedecms 模板静态化
require_once (dirname(__FILE__) . "/../include/common.inc.php"); require_once DEDEINC.&quo ...
- android 自定义View onMeasure中 super.onMeasure 和 setMeasuredDimension
练习写一个自定义的view,代码是抄网上的,第一次写,没有问题,与网上的示例一样的效果, 第二次.第三次,都出现问题,但是解决了. 昨天进行第四次写再写,又出问题不一样的问题了. 首先是想加一个子包, ...
- XE6 & IOS开发之免证书真机调试（1）：颁发属于自己的App签名证书（有图有真相）
网上能找到的关于Delphi XE系列的移动开发的相关文章甚少,本文尽量以详细的图文内容.傻瓜式的表达来告诉你想要的答案. 原创作品,请尊重作者劳动成果,转载请注明出处!!! 1.自己给自己颁发证书, ...
- Maven基础笔记，原理
1.什么是Maven ①Maven是一款实现自动化构建的工具软件. ②构建:从源程序→程序的执行 清理→编译→测试→报告→打包→部署→执行 ③构建工具:Make→Ant→Maven→Gradle... ...
- upgrade to ubuntu14.04, ibus input
升级后ibus拼音输入很奇怪,可能和其他输入法产生混淆.解决很简单,只要打开终端输入 ibus-daemon -drx 不用重启或者登出问题便解决.
- delphi.指针.PChar
此文是delphi.指针.应用姊妹篇,想细化一下PChar应用,所以有了此文. 注意: 1:此文讲的是PChar与字符串相关操作,其它方法暂不多讲. 2:由于D分开Ansi/Unicode的两种完全不 ...
- 转：SAAS 测试
基于SaaS云计算网络性能测试指标研究 来源:中国软件评测中心 作者:马子明 投稿时间:2011-04-02 1.基于SaaS的云计算 SaaS(Software as a Service,软件即 ...