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‘);

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

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

时间: 2024-08-11 05:44:59

9.19 列表特殊行标红的相关文章

ECSHOP模糊分词搜索和商品列表关键字飘红功能

ECSHOP联想下拉框 1.修改page_header.lbi模版文件,将搜索文本框修改为: <input name="keywords" type="text" id="keyword" value="<!--{if ($search_keywords neq "")}{$search_keywords|escape}--><!--{else}-->ecshop<!--{/if}

简单聊聊红黑树(Red Black Tree)

? 前言 众所周知,红黑树是非常经典,也很非常重要的数据结构,自从1972年被发明以来,因为其稳定高效的特性,40多年的时间里,红黑树一直应用在许多系统组件和基础类库中,默默无闻的为我们提供服务,身边有很多同学经常问红黑树是怎么实现的,所以在这里想写一篇文章简单和大家聊聊下红黑树 小编看过很多讲红黑树的文章,都不是很容易懂,主要也是因为完整的红黑树很复杂,想通过一篇文章来说清楚实在很难,所以在这篇文章中我想尽量用通俗口语化的语言,再结合 Robert Sedgewick 在<算法>中的改进的版

python关于列表的操作

1.列表的遍历 1 nameList = ['小马','小小文','小小小飞'] 2 3 #不使用循环,直接输出 4 print(nameList[0]) 5 print(nameList[1]) 6 print(nameList[2]) 7 8 #使用for循环 9 for name in nameList: 10 print(name) 11 12 #使用while循环 13 i=0 14 length = len(nameList) 15 while i<length: 16 print(

Linux工作常用总结

1. 搜索 在vi和vim中如果打开一个很大的文件,不容易找到对应的内容,可以使用自带的搜索关键字进行搜索定位: 在vi和vim界面中输入:"/"(反斜杠),之后会出现一个输入框让你输入,当你输入的关键字在文件中存在就会以高亮的形式显示出来,之后按 回车 就确定定位到当前高亮位置,如果不是你要找的,则可以按:"n",意即寻找下一个输入关键字的内容. 2. vim恢复以及乱码问题 (1) 在vi和vim中如果不小心误删除了一些东西,想要恢复怎么办? 首先要退出编辑状态

掌握好这23个Linux命令常用项,可加薪30%

作为工作几年的Linux运维老司机,总结了Linux命令行的常用的一些用法,希望对您有所收获. 1. 搜索 在vi和vim中如果打开一个很大的文件,不容易找到对应的内容,可以使用自带的搜索关键字进行搜索定位: 在vi和vim界面中输入:"/"(反斜杠),之后会出现一个输入框让你输入,当你输入的关键字在文件中存在就会以高亮的形式显示出来,之后按回车就确定定位到当前高亮位置,如果不是你要找的,则可以按:"n",意即寻找下一个输入关键字的内容. 2. vim恢复以及乱码问

转摘Linux命令工作中常用总结

1. 搜索 在vi和vim中如果打开一个很大的文件,不容易找到对应的内容,可以使用自带的搜索关键字进行搜索定位: 在vi和vim界面中输入:"/"(反斜杠),之后会出现一个输入框让你输入,当你输入的关键字在文件中存在就会以高亮的形式显示出来,之后按 回车就确定定位到当前高亮位置,如果不是你要找的,则可以按:"n",意即寻找下一个输入关键字的内容. 2. vim恢复以及乱码问题 (1) 在vi和vim中如果不小心误删除了一些东西,想要恢复怎么办? 首先要退出编辑状态,

Kubernetes2-K8s的集群部署

一.简介 1.架构参考 Kubernetes1-K8s的简单介绍 2.实例架构 192.168.216.51 master  etcd 192.168.216.53 node1 192.168.216.54 node1 3.拓扑 4.软件版本 [[email protected] ~]# cat /etc/redhat-release CentOS Linux release 7.6.1810 (Core) [[email protected] ~]# uname -a Linux master

CentOS6.5安装和配置RabbitMQ3.5.4

CentOS6.5安装和配置RabbitMQ3.5.4 准备工作 1.RabbitMQ是由Erlang语言开发的,所以安装RabbitMQ之前需要安装Erlang 2.在Erlang官网下载安装包otp_src_17.0.tar.gz 地址:http://www.erlang.org/download/otp_src_17.0.tar.gz 3.在RabbitMQ官网下载安装包rabbitmq-server-generic-unix-3.5.4.tar.gz 地址:http://www.rabb

HashMap源码分析-基于JDK1.8

以下内容翻译于HashMap类的注释 HashMap是map接口的基础实现类.这个实现提供了所有可选的Map接口操作.并且允许null键和null值.HashMap类和Hashtable类差不多,只是HashMap不是线程完全的,并且HashMap允许null值和null键.这个类不保证map元素的顺序,也不保证顺序会随着时间保持不变. 假如hash函数能够使元素在桶中(buckets)均匀地分散,HashMap对于基本的get,put操作提供稳定的性能.集合视图的遍历需要的时间和HashMap