js 实现刷新页面后回到记录时滚动条的位置

vue单页设置页面不刷新 记录滚动条的位置 功能需求 点击第三级分类节点进入商品列表,然后,点击左上方返回按钮,此时页面重新回到了第一个一级分类节点展开的效果。应该改成,返回到当前的一级分类节点下的三级分类节点 vue单页 使用keep-alive页面返回不刷新 法1:设置所有页面进入分类页时都缓存(已试过成功) 是Vue的内置组件,能在组件切换过程中将状态保留在内存中,防止重复渲染DOM。 1.在配置router的文件中设置分类页的keepAlive为true 2.将app.vue文件设置为 <template> <div 阅读详情
window.onbeforeunload = function () {
    var scrollPos;
    if (typeof window.pageYOffset != 'undefined') {
        scrollPos = window.pageYOffset;
    }
    else if (typeof document.compatMode != 'undefined' && document.compatMode != 'BackCompat') {
        scrollPos = document.documentElement.scrollTop;
    }
    else if (typeof document.body != 'undefined') {
        scrollPos = document.body.scrollTop;
    }
    document.cookie = "scrollTop=" + scrollPos; //存储滚动条位置到cookies中  
}


window.onload = function () {
    if (document.cookie.match(/scrollTop=([^;]+)(;|$)/) != null) {
        var arr = document.cookie.match(/scrollTop=([^;]+)(;|$)/); //cookies中不为空,则读取滚动条位置  
        document.documentElement.scrollTop = parseInt(arr[1]);
        document.body.scrollTop = parseInt(arr[1]);
    }
}
vue router keepAlive的页面 到此页面根据不同条件判断是否刷新 不刷新时记录滚动条位置 需求 A—>B—>C,A页面到B页面时,B页面刷新请求数据,从C页面返回到B页面时则不刷新,需要回到原来选中滚动的地方 比如:淘宝的商品列表(B)页面跳转到详情页(C)的时候,当返回上一级的商品列表时,肯定是返回上次浏览的位置,不然用户体验很差,使用了keep-alive之后呢页面不刷新了,随之的问题就是查找特定商品列表(A—>B)时,列表一直是上次缓存的列表页。 解决办法 首先,在app.vue中使用keepAlive,如果是meta信息里keepAlive为true,那就包在keep- 阅读详情

相关推荐

js 实现 记录滚动条位置

js 实现 记录滚动条位置! 值得下载看看!资源免费,大家分享!!

js实现刷新页面,实现滚动条还停留在上次访问的位置,同时用户在列表页进入详情之后,回来还在之前的浏览位置

其实不管是第一个还是第二个,核心都是 记住上一次浏览的位置,记住滚动条所处的位置 不过第一种情况有一个 快捷的处理方式 就是 // 当页面刷新之后 重新回到上次滚动条 所处的位置 window.scrollTop(0, 0); 还有第二种情况就是 我们从当前页面跳走的时候,点击返回的时候 还希望是上次访问的位置 这个时候 就需要 使用 cookie 或者 本地缓存 用来缓存那个滚动的位置了 // 滚动到 上次访问位置 const scrollToView = () => { l

业余前端的职业经历 6315

Ext grid panel 滚动条位置不变

Ext grid panel 滚动条位置不变,适用于实时数据的刷新

前端页面滚动到某个位置的方式

1.通过a标签滚动到对应锚点 <a href="#target">点我滚动到目标</a> <div id="target">我是目标我是目标</div> <!-- 注:这样会在地址栏中加上hash值 #target --> 2.通过window.scrollTo方法滚动 //scrollTo两个参数分别表示显示的x y坐标位置 //document.documentElement.scrollHeight 获取的是整个文档的高度 //滚动

老电影故事的博客 3349

js实现刷新页面后回到记录时滚动条的位置【两种方案可选】

本文主要介绍了页面的div中有滚动条,js实现刷新页面后回到记录时滚动条的位置的两种方案,需要的朋友可以看下

玩转openclaw+企业微信

OpenClaw横空出世:AI从问答到执行的范式革命 OpenClaw作为2026年AI领域的重大突破,实现了从对话机器人到智能执行体的进化。其核心价值在于"自主执行"而非简单交互,通过六层解耦架构(表现层、网关层、运行时层、技能层、工具层、记忆层)构建完整执行闭环。关键技术包括Model Context Protocol实现多模型兼容,以及事件驱动架构确保实时响应。安装过程支持多平台,通过Node.js环境即可快速部署,并支持对接主流大模型。OpenClaw标志着AI开始真正&quot

西木风落 1591

前端滚动条滚动到指定位置

滚动条滚动到指定位置

weixin_47030180的博客 8507

四、ARDUINO UNO开发板介绍

(一)ARDUINO UNO开发板 Arduino生态中包括多种开发板、模块、扩展板。其中UNO R3是最适合入门且功能齐全使用量最多的Arduino开发板。以下就是Arduino UNO R3开发板的图片。 (二)ARDUINO UNO开发板基本构成 Arduino开发板设计得非常简洁,一块AVR单片机、一个晶振或振荡器和一个5V的直流电源。常见的开发板通过一条USB数据线连接计算机。Arduino有各式各样的开发板,其中最通用的是Ardui...

简时刻的博客 7万+

前端实现 页面滚动到一定位置,元素浮动在固定位置上, 滚动定位

先来看下效果哈, 实际上这样的效果还是不少的,就是 用户进入页面的时候可能是正常的流式布局, 但滚动往下的时候有些元素就固定在某个位置。 1. 通过粘性定位实现 其实在布局中有一个 定位就是 粘性定位 sticky 可以实现这个样式 关于粘性定位的概念 我就不在这里一一赘述了 因为之前我有两篇博客进行讲解过了 https://blog.youkuaiyun.com/yunchong_zhao/article/details/114025173 https://blog.youkuaiyun.com/yunchong_zhao/

业余前端的职业经历 5362

控制障碍函数(Control Barrier Function,CBF) 一、定义

介绍控制障碍函数

Lyajpunov的博客 2万+

Nvidia Orin Driveos Camera 介绍及调试详解

自动驾驶-nvidia orin driveos Camera 驱动详解及调试

u011803281的博客 2993

js实现刷新页面后回到记录时滚动条的位置

局部刷新后,要求滚动条在原下拉时的位置: 1、将页面的div的scrolltop距离长度记录在cookie中,然后通过js调整刷新页面时的长度记录,代码如下 &lt;div id="x" style="height: 200px; overflow: scroll" onscroll="SetH(this)"&gt; &lt;/div&gt; &lt;script&gt; var _h =..

FORLOVEHUAN的博客 2838

从 Token 到 Agent:一文串起 AI 大模型核心概念

摘要:本文系统解析了现代AI系统的八大核心概念:Token(语言处理的最小单位)、Context(AI的短期记忆)、Prompt(指令接口)、Tool(能力扩展器)、MCP(工具生态协议)、Agent(自主智能体)和AgentSkill(专业技能封装)。文章揭示了这些概念如何共同构成AI从基础语言理解到自主决策的技术脉络,重点阐述了Token对计算成本的影响、Prompt工程的重要性、Tool如何突破AI的能力边界,以及Agent如何通过"感知-规划-执行-反思"循环完成复杂任务。最后指

jundao1997的专栏 251

JS实现刷新页面后回到记录时滚动条的位置

window.onbeforeunload = function () { var scrollPos; if (typeof window.pageYOffset != 'undefined') { scrollPos = window.pageYOffset; } else if (typeof document.compatMode != 'undefined' && document.compatMode != 'BackCompat'

灿烂的博客 411

【AI大模型:认知升级】1、全面解析AI大模型:从起源到发展脉络与应用价值

AI大模型是具备超大规模参数(千亿至万亿级)、海量训练数据(TB级)和强迁移学习能力的基础模型。其技术特征包括Transformer架构革新、大数据预训练范式及参数规模超过临界值后的能力涌现。发展历程经历了语言模型突破(2018-2020)、多模态融合(2021-2023)和架构创新(2023至今)三波浪潮,遵循数据、算力、算法协同进化规律。底层驱动因素包括能力涌现机制、算力基础设施突破和应用场景拓展,正在重构产业价值链。通过"知识星系""认知

2025博客之星Top81。专注AI工程化与架构实战。从分布式思维到模型部署,用工程化视角为你厘清AI落地的真实路径。 2294

智能手表PCB布局:PPG与IMU传感器噪声隔离与应力解耦设计

在可穿戴设备硬件开发中,PCB布局已超越传统布线范畴,成为决定信号完整性、电磁兼容性与机械可靠性的核心环节。心率传感器(PPG)依赖微伏级光电容积脉搏波信号,极易受数字开关噪声与电源纹波干扰;姿态传感器(IMU)则对PCB弯曲形变引发的机械应力高度敏感。其布局需融合电磁场建模、热-力-电多物理协同及高密度互连约束。关键技术价值体现在噪声路径切断、地弹抑制、应力方向解耦与电源域隔离等工程实践。典型应用场景涵盖智能手表、医疗级贴片设备及微型运动传感终端。本文聚焦PPG与IMU两大模组在STM32L4平台上的实操

weixin_32869687的博客 175

html页面刷新瞬间有滚动条,页面的div中有滚动条,js实现刷新页面后回到记录时滚动条的位置...

当div中绑定数据,给它一个属性overflow-y: scroll,添加长度大小,使其能够出现滚动条;每次刷新的时候滚动条总是会出现在最上方,这使我很头疼,经过查阅网上资料,返现两种方法可行。如下:第一种方案将上一个页面的div的scrolltop距离长度记录在cookie中,然后通过js调整刷新页面时的长度记录,代码如下:js代码: var _h = 0; func...

weixin_42477505的博客 534

在 PFCG 中完成 SAP Fiori 对象分配:把 Business Catalog、Space、Page 与授权一次讲透

摘要:SAP Fiori权限配置的关键在于理解Business Catalog与Space的分层授权逻辑。传统SAP GUI中直接分配事务码的方式不适用于Fiori环境,必须通过PFCG为角色分配Catalog(提供应用访问权限)和Space(控制首页展示结构)。Catalog会自动解析所需OData服务授权,而Space则决定用户在Launchpad中看到的导航布局。常见错误包括直接分配Page而非其所属Space,或仅配置Space而忽略Catalog。最佳实践是优先使用Catalog驱动授权提议,再在

2007 年 ~ 2025 年,深耕 SAP 技术 18 年 327

html刷新页面保持原来位置,js实现刷新页面后回到记录时滚动条的位置【两种方案可选】...

当div中绑定数据,给它一个属性overflow-y: scroll,添加长度大小,使其能够出现滚动条;每次刷新的时候滚动条总是会出现在最上方,这使我很头疼,经过查阅网上资料,返现两种方法可行。如下:第一种方案将上一个页面的div的scrolltop距离长度记录在cookie中,然后通过js调整刷新页面时的长度记录,代码如下:js代码:var _h = 0;function SetH(o) {_h...

weixin_28863429的博客 2351

蓝牙模块HM-10手册

蓝牙模块HM-10手册,该手册对蓝牙模块HM-10进行了详细的介绍和使用方法以及一些AT指令。

数学建模模型总结

这是本人在两年内准备参加数学建模竞赛搜集到的模型资料,已经经过了本人的筛选和整理,希望能够对准备参加数学建模竞赛的学弟学妹们提供一些帮助!

页面的div中有滚动条,js实现刷新页面后回到记录时滚动条的位置

  当div中绑定数据,给它一个属性overflow-y: scroll,添加长度大小,使其能够出现滚动条;每次刷新的时候滚动条总是会出现在最上方,这使我很头疼,经过查阅网上资料,返现两种方法可行。如下:第一种方案  将上一个页面的div的scrolltop距离长度记录在cookie中,然后通过js调整刷新页面时的长度记录,代码如下:js代码:<script>...

weixin_34293246的博客 407

jdk-8u144-linux-x64.tar.gz.

该资源为搭建Linux系统Java环境用,资源的后缀为tar.gz格式的压缩包

html页面刷新瞬间有滚动条,js实现刷新页面后回到记录时滚动条的位置【两种方案可选】...

当div中绑定数据,给它一个属性overflow-y: scroll,添加长度大小,使其能够出现滚动条;每次刷新的时候滚动条总是会出现在最上方,这使我很头疼,经过查阅网上资料,返现两种方法可行。如下:第一种方案将上一个页面的div的scrolltop距离长度记录在cookie中,然后通过js调整刷新页面时的长度记录,代码如下:js代码:var _h = 0;function SetH(o) {_h...

weixin_33614878的博客 553

汉书HE8,好用的汇编代码编写工具

汉书HE8,好用的汇编代码编写工具早期编写汇编代码所用功能强大

写了个WEB中记录滚动条位置的脚本

  Web中难免遇到一些难解决的问题,有些客户就有些变态的要求,刷新后页面继续保持在原来的位置就是一个不好解决的问题.  利用js的cookie写了个脚本,基本上能实现刷新后位置保留 脚本代码如下:     将此脚本插入到网页中即可,网页尽量长,刷新后即可看到效果!script language="javascript">        function SetCookie(s

Nbboy_net的专栏 966
上一篇: js 实现刷新页面后回到记录时滚动条的位置
下一篇: css解决文字单行两端对齐(兼容ie7)
github_39051926
博客等级 码龄9年 3粉丝 36原创
评论 1
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值