一、鼠标事件

　　mouseover(function(){}); 鼠标移动到目标事件

　　mouseout(function(){}); 鼠标离开目标的事件

二、具体应用代码

<body>

    <h3>Books Info:</h3>

    <table id="table">

        <tr>

            <td>书名</td>

            <td>价格</td>

            <td>描述</td>

        </tr>

        <tr>

            <td>《海的女儿》</td>

            <td>11.00</td>

            <td>悬崖上的金鱼姬，海里的女儿</td>

        </tr>

    </table>

</body>

<script type="text/javascript">

    $(function(){

        $("#table").find("tbody>tr:even")   //偶数行的操作

          .mouseover(function(){

              $(this).css("background-color","#9AAAC7");

        }).mouseout(function(){

              $(this).css("background-color","#f9f9f9");

        }).end()

        .find("tbody>tr:odd")   //奇数行的操作

        .mouseover(function(){

                $(this).css("background-color","#9AAAC7");

          }).mouseout(function(){

                $(this).css("background-color","#e5e9f0");

          });

    });
//注：在jQuery中，执行完mouseover或者mouseout等方法之后，都会返回当前的对象，所以可以进行链式操作 

</script>

jquery table的隔行变色 鼠标事件的更多相关文章

  1. jQuery table tr隔行变色，鼠标移入移出变色，鼠标点击变色

    .trover { background: #f9f9f9; } .trclick { background: #c4e8f5; } .treven{ background:#CCFFCC; } .t ...

  2. 用JQuery实现表格隔行变色和突出显示当前行

    用JQuery实现表格隔行变色和突出显示当前行 上源码 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "htt ...

  3. jQuery选择器实现隔行变色和使用javaScript实现隔行变色

    <html xmlns="http://www.w3.org/1999/xhtml"> <head> <!--什么是选择器? jQuery选择器继承了 ...

  4. JS---案例：表格隔行变色(鼠标划过背景色恢复)

    案例:表格隔行变色(鼠标划过背景色恢复) <!DOCTYPE html> <html> <head lang="en"> <meta ch ...

  5. 我的第一个jQuery插件--表格隔行变色

    虽然网上有大量的插件供我们去使用,但不一定有一款适合你的,必要的时候还是要自己动手去敲的.下面,开始我的第一个插件... 参考<锋利的JQuery>,JQuery为开发插件增设了俩个方法: ...

  6. table表格隔行变色

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. jQuery选择器实现隔行变色

    <script type="text/javascript"> $(function(){ $("#tableName tr:nth-child(even)& ...

  8. 隔行变色&&鼠标移入变色

    <html lang="en"> <head> <meta charset="UTF-8"> <title>Do ...

  9. jquery插件之表格隔行变色并鼠标滑过高亮显示

    该插件乃本博客作者所写,目的在于提升作者的js能力,也给一些js菜鸟在使用插件时提供一些便利,老鸟就悠然地飞过吧. 此插件旨在实现表格隔行变色,且鼠标移动在表格的某一行上时,该行能高亮显示.整体代码如 ...

随机推荐

  1. 基础题：HDU 5122 K.Bro Sorting

    Matt's friend K.Bro is an ACMer.Yesterday, K.Bro learnt an algorithm: Bubble sort. Bubble sort will ...

  2. 你认为A和B所在方格颜色相同吗?

    [你认为A和B所在方格颜色相同吗? ]据说全世界只有0.003%的人和photoshop能看出它们的颜色是相同的. 我属于那 99.9997% 的人...因为我不是神...

  3. DevExpress之lookupedit

    DevExpress中的lookupedit的使用方法. 绑定数据源:     lookupedit.properties.valuemember = 实际要用的字段;   //相当于editvalu ...

  4. struts2错误：The Struts dispatcher cannot be found.

    struts2错误:The Struts dispatcher cannot be found. The Struts dispatcher cannot be found. This is usua ...

  5. Delphi TcxTreelist 表格左边总是缩进去 ，好像有偏移 解决方法

    1.  TcxTreelist的表格总是总是缩进去,如下效果 : 但是,新建一个没有偏移 ,经过观察,原来在  属性Images造成的,  把imgToolbars去除就可以了. 效果:

  6. POJ --- 1164 放苹果

    放苹果 Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 24947   Accepted: 15887 Description ...

  7. 理解I/O Completion Port

    欢迎阅读此篇IOCP教程.我将先给出IOCP的定义然后给出它的实现方法,最后剖析一个Echo程序来为您拨开IOCP的谜云,除去你心中对IOCP的烦恼.OK,但我不能保证你明白IOCP的一切,但我会尽我 ...

  8. MVC 依赖注入/控制反转

    http://www.cnblogs.com/cnmaxu/archive/2010/10/12/1848735.html http://www.cnblogs.com/artech/archive/ ...

  9. vmware10安装win8x64（亲测）

    首先,创建虚拟机,选择典型 下一步后 弄完后选择“完成”,这下就可以安装了 之后分区,之后选cdrom做启动,之后安装win8到第一分区

  10. HDU 4749 Parade Show 2013 ACM/ICPC Asia Regional Nanjing Online

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=4749 题目大意:给一个原序列N,再给出一个序列M,问从N中一共可以找出多少个长度为m的序列,序列中的数 ...