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

news2024/11/25 18:37:16

使用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();

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

量子磁场测量“碰上”脑科学,未磁科技无创脑功能成像系统研发成功

从微观的神经元活动到宏观的认知行为,脑科学探索着人类最神秘、最复杂的领域之一。在这个过程中,科研人员、医生和创业者们扮演着至关重要的角色。他们不仅致力于揭示大脑的奥秘,更将科研成果转化为实际应用,推动脑科学领域的进步…

【SQL Server】实验七 数据完整性

1 实验目的 掌握实体完整性、参照完整性和用户自定义完整性约束的创建方法。掌握完整性约束的运行检查机制。掌握参照完整性的级联删除和修改方法。掌握正确设计关系模式完整性约束的方法。 2 实验内容 2.1 掌握实体完整性约束的创建和使用方法 创建表时定义由一个属性组成…

宜搭faas服务器获取accessToken

可以用faas服务器的OpenAPIUtil.getCustomAccessTokenThenCache(Client ID,Client Secret)就可以获取 至于获取这个Client ID,Client Secret 就需要在钉钉开放平台创建一个应用 然后在这个应用的基础信息里面有 注意的是:如果需要…

Rust 程序设计语言学习——所有权

这一节主要来学习 Rust 语言的其他特性,所有权、引用与借用、Slice 类型。 1 所有权 Rust 的核心功能(之一)是所有权(ownership)。虽然该功能很容易解释,但它对语言的其他部分有着深刻的影响。 所有程序…

Rancher操作手册(v2.7.5-rc1)

1.登录 访问地址:10.66.55.132使用账号和密码登录。初始的页面是英文版本,可以点击左下方改为简体中文 登录成功后可以看到现有的集群。右上角可以进行新集群的创建和导入已有集群。点击箭头所指的蓝色集群名称可以进入集群。 2.集群仪表盘 进入到集…

【leetcode】长度最小的子数组, test ok

题目 代码实现 #include <iostream> #include <vector> using namespace std;class Solution { public:int minSubArrayLen(int s, vector<int>& nums) {int n = nums.size();if (n == 0) {return 0;}int ans = INT_MAX;int start = 0, end = 0;int…

Github 2024-03-17 php开源项目日报 Top9

根据Github Trendings的统计,今日(2024-03-17统计)共有9个项目上榜。根据开发语言中项目的数量,汇总情况如下: 开发语言项目数量PHP项目9Blade项目2Laravel:表达力和优雅的 Web 应用程序框架 创建周期:4631 天开发语言:PHP, BladeStar数量:75969 个Fork数量:24281 次关…

Redis远程连接本机——Docker

1. Docker拉取redis镜像并创建容器 1.1 拉取redis镜像 如果要指定redis版本&#xff0c;需要使用redis:&#xff08;版本&#xff09;&#xff0c;不写默认最新版本 docker pull redis1.2 创建容器并挂载配置文件 创建一个redis目录&#xff0c;并在其创建一个conf目录和一个d…

tomcat 实现会话绑定

Tomcat 后端服务器实现 Session ID会话保持 基础架构&#xff1a; 7-6 代理服务器nginx配置 7-3 tomcat 服务器 7-5 同理 测试&#xff1a; 此时刷新&#xff0c;会话ID一直在变&#xff0c;这样不好 如何解决呢&#xff1f; 不好的是确定ip之后&#xff0c;会一直在一台机上…

蓝桥杯单片机快速开发笔记——PWM

一、原理分析 使用定时器输出PWM&#xff08;脉宽调制&#xff09;信号是通过微控制器的定时器模块来生成一种周期性的脉冲信号&#xff0c;通过控制脉冲的高电平时间&#xff08;占空比&#xff09;来控制输出信号的平均功率。以下是生成PWM信号的基本原理概述&#xff1a; 定…

Java获取视频封面图,利用FFmpegFrameGrabber获取视频封面图

依赖 <dependency><groupId>org.bytedeco</groupId><artifactId>javacv-platform</artifactId><version>1.5.9</version></dependency>传入视频流获取图片byte /*** 获取视频截图** param frameNumber 视频的指定帧数* param …

01初识Python

一、Python 简介 二、为什么要学Python? 三、Python 安装 四、输出第一条指令 五、总结 一、Python 简介 Python是一种高级编程语言,由Guido van Rossum于1991年创建。它具有简单易学的语法结构,被广泛应用于Web开发、数据科学、人工智能等领域。 Python具有丰富的库…

SQLiteC/C++接口详细介绍之sqlite3类(十三)

返回目录&#xff1a;SQLite—免费开源数据库系列文章目录 上一篇&#xff1a;SQLiteC/C接口详细介绍之sqlite3类&#xff08;十二&#xff09; 下一篇&#xff1a;SQLiteC/C接口详细介绍之sqlite3类&#xff08;十四&#xff09;&#xff08;未发表&#xff09; 40.sqlite3…

VMware Fusion 13.5.1 OEM BIOS Version - 在 macOS 中运行 Windows 虚拟机的最佳方式

VMware Fusion 13.5.1 OEM BIOS Version VMware Fusion 13 原版 App 中集成 OEM BIOS 请访问原文链接&#xff1a;https://sysin.org/blog/vmware-fusion-13-oem/&#xff0c;查看最新版。原创作品&#xff0c;转载请保留出处。 作者主页&#xff1a;sysin.org 使用 VMware …

51单片机-AT24C02(I2C总线)

目录 一&#xff0c;介绍及元件工作原理 7.时序结构&#xff08;重要&#xff09; 8.i2C总线数据帧&#xff08;重要&#xff09; 二&#xff0c;应用 一&#xff0c;介绍及元件工作原理 1.元件介绍 2.存储器 3.地址总线和数据总线 地址总线只能一次选中一行 4.引脚及应用…

【ESP32 IDF】I2C的使用

文章目录 前言一、I2C驱动使用的步骤二、I2C的使用2.1 配置驱动程序2.2 安装驱动程序2.3 主机写入数据写入数据的过程接收数据的过程 总结 前言 ESP32是一款强大的微控制器&#xff0c;广泛应用于物联网&#xff08;IoT&#xff09;和嵌入式系统开发。它具备丰富的硬件接口&am…

前端Vue与uni-app中的九宫格、十二宫格和十五宫格菜单组件实现

在前端 Vue 开发中&#xff0c;我们经常会遇到需要开发九宫格、十二宫格和十五宫格菜单按钮的需求。这些菜单按钮通常用于展示不同的内容或功能&#xff0c;提供给用户快速访问和选择。 一、引言 在前端开发中&#xff0c;九宫格、十二宫格和十五宫格菜单按钮是一种常见的布局…

提升物流效率,快递平台实战总结与分享

随着电商行业的蓬勃发展&#xff0c;物流配送服务变得愈发重要。快递平台作为连接电商企业和消费者的桥梁&#xff0c;扮演着至关重要的角色。本篇博客将分享快递平台实战经验&#xff0c;总结关键要点&#xff0c;帮助物流从业者提升物流效率、优化服务质量。 ### 快递平台实…

【四 (5)数据可视化之 Pyecharts常用图表及代码实现 】

目录 文章导航一、介绍[✨ 特性]二、安装Pyecharts三、主题风格四、占比类图表1、饼图2、环形图3、玫瑰图4、玫瑰图-多图5、堆叠条形图6、百分比堆叠条形图 五、比较排序类1、条形图2、雷达图3、词云图4、漏斗图 六、趋势类图表1、折线图2、堆叠折线图3、面积图4、堆叠面积图 七…

自动点击脚本

一个简单的自动点击脚本 配置文件张这样&#xff0c;需要的自己截图 excel配置文件 #!/usr/bin/python3# sys.path.append("C:\\Users\苏\\.vscode\\extensions\\ms-python.vscode-pylance-2023.10.50\\dist\\typeshed-fallback\\stubs\\PyAutoGUI") # print(sys.…