zoukankan      html  css  js  c++  java
  • jquery实现表格中点击相应行变色功能

    对于一个表格,为了使我们选中的项更容易区分,需要为选中项添加高亮,同时也需要,将其他项的高亮形式去除。类似于:

    <!DOCTYPE html>
    
    <html lang="en" xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta charset="utf-8" />
        <title></title>
        <link href="css/style.css" rel="stylesheet" type="text/css" />
        <script src="jquery-1.3.2.min.js"></script>
        <script>
            $(function () {
                $('tbody>tr').click(function () {
                    $(this).addClass('selected')      //为选中项添加高亮
                    .siblings().removeClass('selected')//去除其他项的高亮形式
                    .end();
                });
            }); 
        </script>
    </head>
    <body>
        <table>
            <thead>
                <tr><th>姓名</th><th>性别</th><th>暂住地</th></tr>
            </thead>
            <tbody>
                <tr><td>张三</td><td></td><td>浙江宁波</td></tr>
                <tr><td>张三</td><td></td><td>浙江宁波</td></tr>
                <tr><td>张三</td><td></td><td>浙江宁波</td></tr>
                <tr><td>张三</td><td></td><td>浙江宁波</td></tr>
                <tr><td>张三</td><td></td><td>浙江宁波</td></tr>
            </tbody>
        </table>
    </body>
    </html>
  • 相关阅读:
    Nginx安装
    node.js搭建vue脚手架
    Oracle引入数据
    MVC引入Junit单元测试
    Git版本控制器
    IDEA-Maven
    SSM框架整合
    【测试基础第五篇】测试用例编写和评审
    【测试基础第四篇】测试用例设计方法
    【测试基础第三篇】需求测试分析
  • 原文地址:https://www.cnblogs.com/JsonZhangAA/p/5469565.html
Copyright © 2011-2022 走看看