单击浏览器后退按钮时,将用户带回到他们在上一页滚动到的位置

2024-05-03

当用户按下浏览器中的后退按钮时,是否可以将用户带回到他们向下滚动到的页面区域?如 --- pageA 是屏幕大小的两倍(因此您必须滚动才能阅读更多内容)。您单击 pageA 上的链接转到新页面 - pageB。阅读后,您在浏览器中单击“返回”。现在,当您返回到 pageA 时,您又回到了顶部,并且必须向下滚动到您要继续阅读页面其余部分的位置。

有没有 Jquery 或 JS 方法可以返回到页面中的该点。也许有 .scrollTop() 的东西?


如果在页面“加载”事件触发后加载内容,则后退按钮不会将您带回到原来的位置。因为浏览器在“load”事件之前滚动。

在这种情况下,为了让浏览器记住滚动位置,您必须在离开之前将滚动位置和状态(已加载的内容)存储在某处。要么在 cookie 中,要么在 url 哈希中。

如果 pageA 只是一个没有动态内容的静态页面(在“load”事件后加载,则浏览器应该在您返回时记住滚动位置。

对于动态内容来说,至少包括两部分。一是当单击“后退”按钮时恢复页面状态,因此加载所有动态内容,展开或折叠一些扩展器。另一个是滚动到那里。

第一部分取决于页面的实现方式。第二部分,当页面执行 onUnload 时,您可以将滚动顶部放入 cookie 中。例如

$(window).unload(function() {$.cookie('scrollTop',$(window).scrollTop());});
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

单击浏览器后退按钮时,将用户带回到他们在上一页滚动到的位置 的相关文章

随机推荐

  • 如何在fastapi中调用另一个api?

    我能够从另一个 API 获取一个 API 的响应 但无法将其存储在某处 在返回响应之前存储在文件或其他内容中 response RedirectResponse url apiname 我想访问带有标题和正文的发布请求 我想存储此响应内容而
  • Webview 不显示带有颜色的文本

    在我的应用程序中 我在 webview 中显示一些 Html 内容 String webViewConent this is some span style color 2ecc71 sample span string webView l
  • 使用 libsvm 交叉验证后重新训练

    我知道交叉验证用于选择好的参数 找到它们后 我需要在不使用 v 选项的情况下重新训练整个数据 但我面临的问题是 在使用 v 选项训练后 我得到了交叉验证精度 例如 85 没有模型 我看不到 C 和 gamma 的值 在这种情况下我该如何重新
  • 带数据注释的枚举类型的 Json.NET 自定义序列化

    我想序列化一个枚举类型 以便它返回一个数组 其中枚举作为对象 其中包含 值 名称 和数据注释值 我需要序列化方面的帮助 这是我到目前为止所做的 枚举 public enum Status Display Name Active status
  • 如何获取UIImage的大小(KB)

    我从以下位置获取图像didFinishPickingMediaWithInfo UIImage originalImage UIImage info valueForKey UIImagePickerControllerOriginalIm
  • Gatsby 在 graphql 查询返回后获取图像路径

    所以我用 Gatsby 和 Remark 写了一个博客网站 我的帖子结构如下 Library category name article name index md 这非常有效 使我能够制作类似的路径 category name artic
  • Tesseract OCR 将削减的 0 混淆为 8

    我已经在终点字体上训练了 tesseract 但无论如何 我都无法让它识别 0 我正在使用 jTessEditor 创建训练 tif 和框 即使在验证时 它也会将所有 0 读取为 8 我有什么遗漏的吗 下面是 0 的示例 它将其读作 8 我
  • 为 Pipenv 提供不同的源或 git url 以进行生产和开发

    我们正在使用Pipenv https github com pypa pipenv and Pipfiles https github com pypa pipfile用于管理我们的 Python 包需求 我们使用私有 GitLab 服务器
  • Azure Nvidia 中的 apt-update 出现公钥错误

    我在 AZURE 上启动了 NVIDIA VM 并尝试使用进行更新sudo apt update但给出错误 Hit 2 http azure archive ubuntu com ubuntu focal InRelease Hit 3 h
  • uninitialized_copy memcpy/memmove 优化

    我最近开始研究 MSVC 实现中的 STL 那里有一些不错的技巧 但是我不知道为什么使用以下标准 The std uninitialized copy被优化为一个简单的memcpy memmove如果满足某些条件 据我了解 输入范围可以是m
  • 带有子列表的干净架构 toJson(reso 编码器)

    我正在尝试使用干净的架构 由 reso 编码器解释 https resocoder com 2019 09 09 flutter tdd clean architecture course 4 data layer overview mod
  • python round 留下尾随 0 [重复]

    这个问题在这里已经有答案了 我正在尝试将 python 中的浮点数四舍五入到小数点后零位 然而 round 方法每次都会留下尾随 0 value 10 01 rounded value round value print rounded v
  • API 级别 15 的印地语字体(又名 Android 4.0.2)

    我有一个基于印地语内容的 Android 应用程序 并使用了 Android API 16 SDK 中的 devangiri 字体 并重命名为印地语 ttf 文本在 API 级别 16 和 17 上渲染良好 但在 Android API 级
  • Unity3D:在 AA 解析后绘制粒子以提高性能

    我正在尝试评估 MSAA 对 Unity 中含有大量粒子的场景的影响 为此 我需要 使用 8x MSAA 绘制场景中的所有非粒子对象 使用上一个通道中解析的深度缓冲区来渲染所有 将非遮挡粒子系统转移到较小的渲染目标上 将 2 的颜色缓冲区与
  • 如何使用 Gmail 帐户对 Android 中的应用程序进行身份验证?

    在 android 中 我如何通过 Gmail 帐户对用户进行身份验证 他们有适用于 android 的 api 或支持吗 谢谢 是的 您可以在 Android 中使用 OAuth 有一篇帖子对此说的很详细 Android 中使用适用于 J
  • 在 OpenGL ES 1.1 中将多个纹理绑定到一个网格

    如果我有一个网格 例如有 6 个面的立方体 每个面分别由 4 个顶点组成 总共 24 个顶点 并且我想对每个面应用不同的纹理 我该怎么做 目前 我使用 glDrawElements 一次绘制整个网格 立方体的所有 6 个面 将所有索引提供到
  • 如何获取magento中登录客户的订单列表

    我正在努力获取客户订购的订单号 名称 列表 我尝试过使用 Mage getModel sales order gt load order id 但对我不起作用 实际上 我正在开发帮助台模块并尝试将订单分配给票证 好的朋友 感谢您的提示 我通
  • cv2.imread:检查图像是否正在被读取

    我正在用 python 编写一个 OpenCV 程序 在某些时候我有类似的东西 import cv2 import numpy as np img cv2 imread myImage jpg do stuff with image her
  • 在 iOS8 中使用 UISearchBar 启用取消按钮

    有什么方法可以启用 UISearchBar 的 取消 按钮吗 现在 每当我致电辞职第一响应者时 取消按钮都会被禁用 仅当我再次点击搜索栏时 取消才会启用 有没有办法停止禁用取消按钮 这是适用于 iOS 8 和 Swift 的可行解决方案 f
  • 单击浏览器后退按钮时,将用户带回到他们在上一页滚动到的位置

    当用户按下浏览器中的后退按钮时 是否可以将用户带回到他们向下滚动到的页面区域 如 pageA 是屏幕大小的两倍 因此您必须滚动才能阅读更多内容 您单击 pageA 上的链接转到新页面 pageB 阅读后 您在浏览器中单击 返回 现在 当您返