zoukankan      html  css  js  c++  java
  • jquery table的隔行变色 鼠标事件

    一、鼠标事件

      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>
  • 相关阅读:
    会议10
    会议09
    回忆8
    会议07
    团队报告三
    深圳展会问题关注
    移动电源频率设置
    安卓java设置字体颜色
    安卓取消默认的标题栏方法
    安卓,按钮清晰的事件注册写法
  • 原文地址:https://www.cnblogs.com/renxiaoren/p/5274837.html
Copyright © 2011-2022 走看看