我用的是渲染页面，将自定义的值作为一个表示符判断当前状态

<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title></title>

        <style type="text/css">

            /*滑动变色*/

            .min table tr:hover{

                    background-color: #DFF0D8;

            }

        </style>

    </head>

    <body>

        <div class="min">

            <table>

                <tr id="row1" onclick="clicks('row1')" val="0">

                    <td>0.0</td>

                    <td>1.1</td>

                    <td>2.2</td>

                </tr>

                <tr id="row2" onclick="clicks('row2')" val="0">

                    <td>0.0</td>

                    <td>1.1</td>

                    <td>2.2</td>

                </tr>

                <tr id="row3" onclick="clicks('row3')" val="0">

                    <td>0.0</td>

                    <td>1.1</td>

                    <td>2.2</td>

                </tr>

            </table>

        </div>

        <script type="text/javascript" src="js/jquery-3.1.1.min.js" ></script>

        <script>

            function clicks(row){

                //使用val判断状态

                var IsCheck = $("#" + row).attr("val");

                if (IsCheck == "1") {

              $("#" + row).css("background-color", "");

              $("#" + row).attr("val", "0");

           } else {

              $("#" + row).css("background-color", "#00ccff");

              $("#" + row).attr("val", "1");

           }

            }

        </script>

    </body>

</html>

Js 实现 多个tr 点击变色，再点击还原的更多相关文章

  1. input radio点击选中再点击取消

    这里主要说一下这个jquery中的data()方法,个人感觉这个方法平时挺少用到的,所以说一说,按照官方的解释就是 向元素附加数据,然后取回该数据; 嗯,是的,就是这么简单. 那这里说一下这个方法的使 ...

  2. jquery对类的操作,添加,删除,点击添加,再点击删除

    jquery对类的操作,添加(addClass),删除l类(remoceClass),点击添加,再点击删除(toggleClass)

  3. [转]Cordova Android 返回键拦截（backbutton）和退出（再点击一次跳出）

    本文转自:https://blog.csdn.net/aierJun/article/details/53944061 在Android原生webview里重写onBackPressed()就可以.@ ...

  4. (网页)angular中实现li或者某个元素点击变色的两种方法(转)

    转自脚本之家: 本篇文章主要介绍了angular中实现li或者某个元素点击变色的两种方法,非常具有实用价值,需要的朋友可以参考下 本文介绍了angular中实现li或者某个元素点击变色的两种方法,分享 ...

  5. jquery 与javascript关系 ①取元素 ②操作内容 ③操作属性 ④操作 样式 ⑤ 事件 点击变色

    jQuery的min版本和原版功能是一样的,min版主要应用于已经开发成的网页中,而非min版 的文件比较大,里面有整洁的代码书写规范和注释,主要应用于脚本开发过程当中. JQuery是继protot ...

  6. 2016/4/1 jquery 与javascript关系 ①取元素 ②操作内容 ③操作属性 ④操作 样式 ⑤ 事件 点击变色

    jQuery的min版本和原版功能是一样的,min版主要应用于已经开发成的网页中,而非min版 的文件比较大,里面有整洁的代码书写规范和注释,主要应用于脚本开发过程当中. JQuery是继protot ...

  7. android 自定义控件——（五）按钮点击变色

    ----------------------------------按钮点击变色(源代码下有属性解释)------------------------------------------------- ...

  8. js在table指定tr行上或底下添加tr行

    js在table指定tr行上或下面添加tr行 function onAddTR(trIndex)         {             var tb = document.getElementB ...

  9. js遍历添加栏目类添加css 再点击其它删除css

    //js遍历添加栏目类添加css 再点击其它删除css $(".radio-group .ckselect").each(function(index) { $(this).cli ...

  10. JS动态创建Table,Tr,Td并赋值

    JS动态创建Table,Tr,Td并赋值. 成果库修改: 要求主题列表随成果类型改变而改变 网上查询资料后开工,在成果类型下拉框添加change()事件触发Dwr,查询主题集合——动态创建/编辑Tab ...

随机推荐

  1. java：redis（redis安装配置，redis的伪集群配置）

    1.redis安装配置: .安装gcc : yum install gcc-c++ .使用FTP工具FileZilla上传redis安装包到linux根目录下(当前步骤可以替换为:在root目录下执行 ...

  2. 【HANA系列】SAP HANA SQL取表中每行最小值

    公众号:SAP Technical 本文作者:matinal 原文出处:http://www.cnblogs.com/SAPmatinal/ 原文链接:[HANA系列]SAP HANA SQL取表中每 ...

  3. P5019 铺设道路

    #include<bits/stdc++.h> using namespace std; ]; ; int main() { cin>>n; ;i<=n;i++) cin ...

  4. 【AMAD】Pysnooper -- 别再用print进行debug了

    简介 动机 作用 用法 热度分析 源码分析 个人评分 简介 pysnooper是低配版debugger,别再用print进行debug了. 动机 想象一个场景,你的Python代码运行后不产生你要的效 ...

  5. 一加手机2 进入recovery 模式无法挂载USB存储器通过命令窗口上传ROM镜像

    试过3.0.3-0和3.0.3-1的recovery都无法使用“挂载USB大容量存储器”模式,这肯定让很多清掉系统(就是system分区)的小伙伴无力吐槽,因为这样子rom就无法在rec里面从电脑拷到 ...

  6. Samba的认识

    Samba服务 samba是一个网络服务器,用于Linux和Windows之间共享文件. samba端口号 samba (启动时会预设多个端口) 数据传输的TCP端口 139.445 进行NetBIO ...

  7. 【计算机视觉】背景建模--Vibe 算法优缺点分析

    一.Vibe 算法的优点 Vibe背景建模为运动目标检测研究邻域开拓了新思路,是一种新颖.快速及有效的运动目标检测算法.其优点有以下两点: 1.思想简单,易于实现.Vibe通常随机选取邻域20个样本为 ...

  8. eclipse 建立 web fragment project 工程

    1.鼠标右键---------new ---------Other 2.选择WEB----web fragment project 3.输入工程名,点finish

  9. 解决Iframe跨域高度自适应,利用window.postMessage()实现跨域消息传递页面高度（JavaScript）

    在iframe跨域引用高度自适应这块写的js方式都试了不管用,最终使用的是window.postMessage() 跨域获取高度 传递信息 1.首先,在主页面上使用iframe引入子页面:也就是A.h ...

  10. 2019牛客暑期多校训练营（第二场）-E MAZE

    题目链接:https://ac.nowcoder.com/acm/contest/882/E 题意:n×m的矩阵,0表示可以走,1表示墙,不能通过.有q中操作,一种是改变坐标(x,y)的状态,一种是询 ...