当前位置: 首页 > 面试题库 >

即使使用javascript重新加载后仍保留滚动条位置

归俊
2023-03-14
问题内容

我有一个要求,如果我单击一个复选框,该值将被提交,因此该页面将被重新加载。现在,要单击另一个复选框,我需要再次向下滚动,这不是一个更好的主意。所以,现在即使页面重新加载后,我也想保留滚动条的位置。javascript中有什么方法可以做到这一点吗?我已经尝试了下面的代码,但是没有运气。

<input type="checkbox" onclick="myFunction()"/> One <br/>

function myFunction() {
         document.body.scrollTop = 500px;
        }

我也浏览了许多网站,但没有任何帮助。请帮我解决这个问题。

谢谢。


问题答案:

您可以使用 会话存储 来存储位置,然后在重新加载页面时返回该位置,如下所示:

$(window).scroll(function() {
  sessionStorage.scrollTop = $(this).scrollTop();
});

$(document).ready(function() {
  if (sessionStorage.scrollTop != "undefined") {
    $(window).scrollTop(sessionStorage.scrollTop);
  }
});


 类似资料:
  • 请考虑以下代码: 忽略所有axios请求: login.js 此页面通过将loggedIn更改为true并将currentUser更改为“fa”来更新GlobalContext。 profile.js 这将获取状态并记录它。 下面是reducer.js和globalcontext.js: 一切工作都很好,一旦我登录,我就会被重定向到主页,就像我应该做的那样,正确的状态正在被记录。 但是,一旦我刷新

  • 问题内容: 我正在尝试使用JavaScript检测浏览器滚动条的位置,以确定当前视图在页面中的位置。我的猜测是,我必须检测轨道上的拇指在哪里,然后检测拇指的高度占轨道总高度的百分比。我是不是过于复杂了,还是JavaScript提供了比这更简单的解决方案?任何想法代码明智? 问题答案: 您可以使用和获取分别滚动的垂直和水平偏移。可如果你关心整个页面。如果需要百分比,可以将其与和(再次可能是主体)进行

  • 问题内容: 我的下拉列表中有很多复选框,因此此容器具有滚动功能。但是,当我单击任何复选框时,它会自行选择\取消选择,然后更改状态。 因此,问题在于重新渲染后,此容器又回到了顶部。是否可以在渲染后保持容器的滚动而不将其保存到状态? 问题答案: 您可以在提交阶段之前保存滚动位置的“快照”。 getSnapshotBeforeUpdate()显示您正在寻找的种类。 该文档示例将当前滚动位置保存在生命周期

  • 我们将设置为 1 小时,如下所示(以前设置为 72H) 使用以下Kafka命令行工具,我们将kafka 设置为< code>1H。我们的目标是清除topic - 中比1H旧的数据,因此我们使用了以下命令: 此外 两个命令都运行无误。 但问题是关于Kafka的数据,它比1H更老,仍然存在! 实际上,没有从主题分区中删除任何数据。我们有HDP Kafka集群版本1.0x和ambari 我们不明白为什么

  • 这是我使用的一个引用,它解释了如何使一个div在其滚动条隐藏的情况下可滚动。唯一的区别是我有嵌套的div。检查我的小提琴 HTML: CSS: 像上面,我有一个溢出的水平div和我想隐藏它的滚动条。我必须使其仍然可滚动,因为否则将无法工作。 更新: 我已经读了所有的答案,但我仍然没有解决我的问题,也不知道是什么原因造成的。这是有麻烦的生活。基本上,我试图遵循这几乎完全相同的,但一定有一些原因,我的