zoukankan      html  css  js  c++  java
  • 9.19 列表特殊行标红

    这个版本我做的模块有个需求,点击延期还款客户复选框后,将列表中延期还款超过当前日期的一行标红。

    没做之前我觉得排序和标红很难,所以一直没有做,往后压,现在排序已经做好啦,花了大半天,然后来做标红。

    之前我设想选中复选框后,可能用到刷新列表函数tableUpdate(),甚至想过用到filter的render函数。所以有点慌。

    开始做之后,突然想到,选中复选框后,直接找出超时的td,然后将它的父节点tr一整行color改为红色就好了呀!

    在网上看了下遍历td的代码,然后就开始写了。

    基本思路是:取 table 的 tbody 的所有 tr, 存到 trList , 遍历 trList, 找到第 i 个 tr 的后代 td 元素,

      取出其中指定列的 td ,取其值,判断改值是否超时,若超时则给当前 tr 设置css样式 (color,red) ,

      当取消标红时,将当前 tbody 的所有 tr 设置颜色为默认即可。

    代码如下:

    //标红延期垫款核销客户
    $('#showRed').on('change', function(){
         if($(this).attr('checked')){
             $(this).removeAttr('checked');
            $("#advTable tbody").children('tr').css('color','');
          }else{
             $(this).attr('checked','true');
    
              var trList = $("#advTable tbody").children("tr");
              for (var i = 1; i < trList.length; i++) {
                  var td = trList.eq(i).find("td").eq(7).html();
                   if(td > 500){ //
                      trList.eq(i).css('color','red');
                    }
              }
         }
    });

    不过还要去排序事件和reload函数里去加一下,因为每次点击排序或者改变筛选条件后会刷新列表,红色会被重置掉,需要特意取消标红复选框的选中。

    //改变筛选条件后取消标红复选框
     $('#showRed').removeAttr('checked');

    总结:光靠想是不能解决问题的。不要怕,只要下手开始去做,问题总会被解决的。

    虽然这个功能很简单,但是我很开心。继续加油吧!

  • 相关阅读:
    log4j
    JDBCtemplete 模板
    动态代理 aop切面实现事务管理
    spring
    spring mvc 简单实现及相关配置实现
    ssm整合
    Jquery
    Git分布式版本控制系统
    Java web server 基本实现原理
    jvm
  • 原文地址:https://www.cnblogs.com/yan89/p/7552756.html
Copyright © 2011-2022 走看看