JQuery实现隔行变色和突出显示当前行 效果

运行效果如下图:

jquery关键代码:

html关键代码


   <html>
    <head>
        <meta charset="UTF-8"/>
        <title>JQuery实现隔行变色和突出显示当前行 效果</title>
        <script type="text/javascript" src='jquery.js'></script>
        <script type="text/javascript" src='js.js'></script> <!--加载jq部分处理代码-->

    </head>
    <body>
        <div>
            <table border="1" cellspacing="0" cellpadding="0"  class="data_list">
                <tr><th>用户姓名</th><th>用户性别</th><th>用户电话</th><th>用户邮箱</th><th>预计购置时间</th></th></tr>
                <tr><td>name1</td><td>男</td><td>13900139000</td><td>test@hioop.net</td><td>2014-12-02</td></tr>
                <tr><td>name2</td><td>男</td><td>13900139000</td><td>test@hioop.net</td><td>2014-12-02</td></tr>
                <tr><td>name3</td><td>男</td><td>13900139000</td><td>test@hioop.net</td><td>2014-12-02</td></tr>
                <tr><td>name6</td><td>男</td><td>13900139000</td><td>test@hioop.net</td><td>2014-12-02</td></tr>
                <tr><td>name4</td><td>男</td><td>13900139000</td><td>test@hioop.net</td><td>2014-12-02</td></tr>
                <tr><td>name5</td><td>男</td><td>13900139000</td><td>test@hioop.net</td><td>2014-12-02</td></tr>           
            </table>
        </div>
    </body>
</html>

转载请注明出处,谢谢!

posted @ 2014-11-03 14:28  hioop  阅读(603)  评论(0)    收藏  举报

Copyright © hioop.net