zoukankan      html  css  js  c++  java
  • 用脚本添加mouseover和mouseout事件

    通常列表采用表格显示,每一行有鼠标在上面时,置亮背景,鼠标移开,则恢复原来背景,这样才够有人性。


    可是页面输出的时候,如果每行都写上 onmouseover,onmouseout,再加上函数名,参数,行数一多的话,页面就比较大了,看上去也很傻。


    可以采用页面输出完毕后,才用脚本将这2个事件补上去。


    脚本如下:


     $(document).ready(function() {
        $("#tbList tr").not("#trTop").not("#trHead").mouseover(function(){ $(this).css("background-color","#f1F8F9");});
        $("#tbList tr").not("#trTop").not("#trHead").mouseout(function(){ $(this).css("background-color","white");});
     })
         


    tbList是table的ID

    trTop,trHead是固定背景色的行,无须这种背景置亮效果。

    <table id="tbList" width="100%" cellpadding="0" cellspacing="0">
    <tr id="trTop">
    <td colspan="5">
    。。。
    </td>
    </tr>
    <tr id="trHead">
    <td id="gap"></td>
    <td>标题</td>
    <td style="35px;">私密</td>
    <td style="45px;">日期</td>
    <td style="65px;">操作</td>
    </tr>
    
    <tr>
    <td></td>
    <td><span><a href="mine_show.aspx?id=19" title="内衣宠爱自己是爱情魔咒" target="_blank">内衣宠爱自己是爱情魔咒</a></span></td>
    <td>公开</td>
    <td>10-13</td>
    <td>
        <a href='/Add.aspx?id=19'>编辑</a>
        <a href="javascript:DelIt(19)">删除</a>
    </td>
    </tr>
    </table>


  • 相关阅读:
    巴厘岛的雕塑(sculptures)
    BZOJ4361: isn
    BZOJ2131: 免费的馅饼
    BZOJ4240: 有趣的家庭菜园
    BZOJ5484: [Usaco2018 Dec]Sort It Out
    BZOJ 2151: 种树
    HDU 1285 确定比赛名次(拓扑排序+优先队列)
    申请中文域名并跳转到个人网站(多种方法的尝试)
    Java binarysearch方法
    eclipse2019-12设置中文
  • 原文地址:https://www.cnblogs.com/leftfist/p/4258052.html
Copyright © 2011-2022 走看看