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

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

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Artemis Finance引领Metis流动性质押,并启动积分空投活动

在以太坊可扩展性解决方案中, Optimism、Arbitrum等Layer2链主要面临两个问题:欺诈/有效性证明以及去中心化排序器Sequencers。在实际的发展过程中,Optimism或Arbitrum等Layer2链仍然侧重于在欺诈证明和有效性证明方面进行努力,在…

springboot爱看漫画小程序的设计与实现

摘 要 相比于以前的传统手工管理方式,智能化的管理方式可以大幅降低爱看漫画的运营人员成本,实现了爱看漫画的标准化、制度化、程序化的管理,有效地防止了爱看漫画的随意管理,提高了信息的处理速度和精确度,能够及时、…

C# 面试题及答案整理,最新面试题

解释C#中的垃圾回收机制是如何工作的。 C#中的垃圾回收(GC)机制是CLR(公共语言运行时)的一部分,负责自动管理内存,具体工作原理如下: 1、分代回收: GC将对象分为0代、1代和2代三代…

十四、自回归(AutoRegressive)和自编码(AutoEncoding)语言模型

参考自回归语言模型(AR)和自编码语言模型(AE) 1 自回归语言模型( AR) 自回归语言模型(AR)就是根据上文内容(或下文内容)预测下一个(或前一个&…

wsl2+docker-desktop环境,个别命令卡住问题

*在win11本地搭建了一套开发环境,之前一直用得很舒服,最近发现些问题,查了几天,记录下解决方案。*环境信息: 问题:在wsl2的ubuntu虚拟机中,有时会出现个别命令运行卡住不返回 像上图&#xff0…

springboot基于spring boot的在线答题微信小程序

摘 要 在线答题微信小程序是考试中重要的一环,在线答题是学生获取任务信息的主要渠道。为了方便学生能够在网站上查看任务信息、考试,于是开发了基于 springboot框架设计与实现了一款简洁、轻便的在线答题微信小程序。本微信小程序解决了在线答题事务中的…

基于最小二乘法的太阳黑子活动模型参数辨识和预测matlab仿真

目录 1.程序功能描述 2.测试软件版本以及运行结果展示 3.核心程序 4.本算法原理 5.完整程序 1.程序功能描述 基于最小二乘法的太阳黑子活动模型参数辨识和预测matlab仿真。太阳黑子是人们最早发现也是人们最熟悉的一种太阳表面活动。因为太阳内部磁场发生变化,…

sqllab第二十五A关通关笔记

知识点: 数值型注入双写绕过 oorranand这里不能用错误注入(固定错误回显信息)联合注入 测试发现跟25关好像一样,就是过滤了and or # 等东西 构造payload:id1/0 发现成功运算了,这是一个数值型的注入 构造payload:id…

滑块验证码

1.这里针对滑块验证给了一个封装的组件verifition,使用直接可以调用 2.组件目录 3.每个文件的内容 3.1 Api文件中只有一个index.js文件,用来存放获取滑块和校验滑块结果的api import request from /router/axios//获取验证图片 export function reqGe…

Spark-Transformation以及Action开发实战

文章目录 创建RDDTransformation以及ActionTransformation开发Action开发RDD持久化共享变量创建RDD RDD是Spark的编程核心,在进行Spark编程是,首要任务就是创建一个初始的RDDSpark提供三种创建RDD方式:集合、本地文件、HDFS文件 集合:主要用于本地测试,在实际部署到集群运…

MySQL--深入理解MVCC机制原理

什么是MVCC? MVCC全称 Multi-Version Concurrency Control,即多版本并发控制,维持一个数据的多个版本,主要是为了提升数据库的并发访问性能,用更高性能的方式去处理数据库读写冲突问题,实现无锁并发。 什…

R语言深度学习-5-深度前馈神经网络

本教程参考《RDeepLearningEssential》 本篇我们将学习如何建立并训练深度预测模型。我们将关注深度前馈神经网络 5.1 深度前馈神经网络 我们还是使用之前提到的H2O包,详细可以见之前的博客:R语言深度学习-1-深度学习入门(H2O包安装报错解决…