layui table列表重载后保持进度条位置不变

使用layui的table表格组件时,当我们操作了某行的修改后,刷新了页面,进度条则跳回到最上面。

除了layui高版本应该内置有方法解决了此问题,但是低版本需要另外想办法解决。

具体解决方式如下:

1.在编辑操作成功前,即刷新页面前要获取到当前列表滚动的位置并记录下来。

2.列表重新刷新渲染完成后将滚动条设置滚动到上次记录的位置

做法:

1.定义全局变量 保存滚动条位置

var topScroll = 0;

2.table.render内有列表渲染完成后的回调 done

所以在done的回调函数最后写入  $(".layui-table-main").scrollTop(topScroll) 即列表刷新后滚动条指定滚动到上次位置

3.刷新前记录获取滚动条位置,并保存到全局变量中。done回调中,我们一般会调用table.on('tool(dataTable)', function (obj) {} 用来监控每行进行的编辑或其他操作,所以在点击这些操作时,便记录操作行的滚动位置  

topScroll = $('.dataTable').next('.layui-table-view').find('.layui-table-body').scrollTop();

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/462697.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

数据可视化-ECharts Html项目实战(2)

在之前的文章中,我们学习了如何创建简单的折线图,条形图,柱形图并实现动态触发,最大最小平均值。想了解的朋友可以查看这篇文章。同时,希望我的文章能帮助到你,如果觉得我的文章写的不错,请留下…

RabbitMQ进阶

1.消息可靠性 消息从发送,到消费者接收,会经历多个过程: 其中的每一步都可能导致消息丢失,常见的丢失原因包括: - 发送时丢失: - 生产者发送的消息未送达exchange - 消息到达exchange后未到达queue - MQ宕机,queue将消息丢失 - consumer接收到消息后未消费就宕机 …

Rocky Linux 基本工具的安装

1.系统安装后先查看ip地址 ip addr 2.安装net工具 :ifconfig yum install net-tools 3.安装gcc ;选择都选 y yum install gcc yum install gcc-c 4.安装tcl yum install -y tcl 5.安装lsof (端口查看工具) yum install l…

JMeter 面试题及答案整理,最新面试题

JMeter中如何进行性能测试的规划和设计? 进行JMeter性能测试的规划和设计主要遵循以下几个步骤: 1、确定测试目标: 明确性能测试的目的和目标,比如确定要测试的系统性能指标(如响应时间、吞吐量、并发用户数等&#…

前端跨平台开发框架:简化多端开发的利器

🤍 前端开发工程师、技术日更博主、已过CET6 🍨 阿珊和她的猫_CSDN博客专家、23年度博客之星前端领域TOP1 🕠 牛客高级专题作者、打造专栏《前端面试必备》 、《2024面试高频手撕题》 🍚 蓝桥云课签约作者、上架课程《Vue.js 和 E…

#QT(MainWindow初尝---文本编辑器)

1.IDE:QTCreator 2.实验:使用MainWindow做一个文本编辑器 3.记录 (1)创建几个功能 (2)为几个功能写实现,这里不能使用转到槽,需要自己用connect函数关联。这里的功能是QAction类&am…

FAN3224TMX门极驱动器中文资料PDF数据手册引脚图参数价格图片功能特性

产品概述: FAN3223-25 系列双 4A 门极驱动器以较短的开关间隔提供高峰值电流脉冲,用于在低侧开关应用中驱动 N 沟道增强模式 MOSFET。该驱动器提供 TTL 或 CMOS 输入阈值。内部电路将输出保持在低电平,直到电源电压处于运行范围内&#xff0…

洛谷 P1958 上学路线

题目描述 你所在城市的街道好像一个棋盘,有 a 条南北方向的街道和 b 条东西方向的街道。南北方向的 a 条街道从西到东依次编号为 1 到 a,而东西方向的 b 条街道从南到北依次编号为 1 到 b,南北方向的街道 i 和东西方向的街道 j 的交点记为 (…

Swift 面试题及答案整理,最新面试题

Swift 中如何实现单例模式? 在Swift中,单例模式的实现通常采用静态属性和私有初始化方法来确保一个类仅有一个实例。具体做法是:定义一个静态属性来存储这个单例实例,然后将类的初始化方法设为私有,以阻止外部通过构造…

基于CNN多阶段图像超分+去噪(超级简单版)

这是之前的一项工作,非常简单,简单的复现了两个算法,然后把它们串起来了。 可执行的程序链接:CSDN; Github 我们分成两部分进行讲解: 1. 图像去噪 1.1 基本思路 图像的去噪工作基于很普通的CNN去噪,效…

Linux操作系统-汇编LED驱动程序基础

一、汇编LED原理分析 IMX6ULL-LED灯硬件原理分析: 1、使能时钟,CCGR0-CCGR6这7个寄存器控制着IMX6ULL所有外设时钟的使能。为了简单,设置CCGR0-CCGR6这7个寄存器全部为0XFFFFFFFF,相当于使能全部外设时钟。(在IMX6ULL芯…

java算法第25天 | ● 216.组合总和III ● 17.电话号码的字母组合

这两道题都是基于回溯的基本问题。 216.组合总和III 这道题是77.组合问题的变体&#xff0c;只不过终止条件多了一个和等于n。 class Solution {List<List<Integer>> resnew ArrayList<>();List<Integer> pathnew ArrayList<>();public List&l…

matlab采用PSO优化算法进行机器人线路规划

1、内容简介 略 63-可以交流、咨询、答疑 matlab采用PSO优化算法进行机器人线路规划 2、内容说明 避障&#xff0c;PSO算法&#xff0c;固定点优化&#xff0c;支持障碍物、优化点设置 matlab采用PSO优化算法进行机器人线路规划 3、仿真分析 4、参考论文 略

FFmpeg查看所有支持的编码/解码器/封装/解封装/媒体格式/滤镜

查看所有支持的编码器与解码器 ffmpeg -codecs 只查看所有编码器: ffmpeg -encoders 只查看所有解码器: ffmpeg -decoders 只查看H264编码器: ffmpeg -h encoderh264 只查看H264解码器: ffmpeg -h decoderh264 查看所有支持的封装: ffmpeg -muxers 查看所有支持的解封装…

【MySQL】5. 数据类型

数据类型 1. 数据类型分类 2. 数值类型 2.1 tinyint类型 数值越界测试&#xff1a; mysql> use tt; Database changed mysql> create table t1(-> num tinyint-> ); Query OK, 0 rows affected (0.01 sec)mysql> insert into t1 values(-128); Query OK, 1 r…

Zookeeper 作为Dubbo端注册中心基础知识

Dubbo 官方推荐使用 ZooKeeper 作为注册中心&#xff0c;它是在实际生产中最常用的注册中心实现&#xff0c;这也是我们本课时要介绍 ZooKeeper 核心原理的原因。 要与 ZooKeeper 集群进行交互&#xff0c;我们可以使用 ZooKeeper 原生客户端或是 ZkClient、Apache Curator 等…

vscode jupyter 如何关闭声音

网上之前搜的zen模式失败 仅仅降低sound失败 #以下是成功方式&#xff1a; 首先确保user和remote的声音都是0&#xff1a; 然后把user和remote的以下设置都设置为off就行了&#xff01; 具体操作参考 https://stackoverflow.com/questions/54173462/how-to-turn-off-or-on-so…

C语言 内存函数

目录 前言 一、memcpy()函数 二、memmove()函数 三、memset函数 四、memcmp()函数 总结 前言 在C语言中内存是我们用来存储数据的地址&#xff0c;今天我们来讲一下C语言中常用的内存函数。 一、memcpy()函数 memcpy()函数与我们之前讲的strcpy()函数类似&#xff0c;只…

计算机网络-概述

文章目录 1.2 因特网概述1.2.1 网络、互连网&#xff08;互联网&#xff09;和因特网1.2.2 因特网发展的三个阶段1.2.4 因特网的组成 1.3 三种交换方式1.3.1 电路交换1.3.2 分组交换1.3.3 报文交换1.3.4 三种方式对比 1.4 计算机网络的定义1.5 计算机网络的性能指标1.5.1 速率1…

鸿蒙Harmony应用开发—ArkTS声明式开发(容器组件:Tabs)

通过页签进行内容视图切换的容器组件&#xff0c;每个页签对应一个内容视图。 说明&#xff1a; 该组件从API Version 7开始支持。后续版本如有新增内容&#xff0c;则采用上角标单独标记该内容的起始版本。 该组件从API Version 11开始默认支持安全区避让特性(默认值为&#x…