Javascript 防止浏览器在“后退”按钮上捕捉到上一个滚动位置_Javascript_Jquery

Javascript 防止浏览器在“后退”按钮上捕捉到上一个滚动位置

javascript jquery

Javascript 防止浏览器在“后退”按钮上捕捉到上一个滚动位置,javascript,jquery,Javascript,Jquery,在我的AJAX应用程序中，有一个包含包含图像的文件夹的主页。当用户单击某个文件夹时，它会隐藏这些文件夹，然后用该文件夹中的图像重新填充同一个div。这一切都是使用hashtags完成的一切都很好，直到他们点击后退按钮当用户单击后退按钮时，会发生以下情况（按顺序，每次）：发生的第一件事是浏览器迅速恢复到上次访问该散列时的位置调用myhashchange事件以删除缩略图现在删除缩略图后没有足够的内容高度，窗口必须快速恢复到0的scrollTop，因为在一瞬间没有滚动条然后再次显示文件夹

在我的

AJAX

应用程序中，有一个包含包含图像的文件夹的主页。当用户单击某个文件夹时，它会隐藏这些文件夹，然后用该文件夹中的图像重新填充同一个div。这一切都是使用hashtags完成的

一切都很好，直到他们点击后退按钮

当用户单击后退按钮时，会发生以下情况（按顺序，每次）：

发生的第一件事是浏览器迅速恢复到上次访问该散列时的位置

调用my

hashchange

事件以删除缩略图

现在删除缩略图后没有足够的内容高度，窗口必须快速恢复到0的scrollTop，因为在一瞬间没有滚动条

然后再次显示文件夹

然后，我的脚本开始将用户恢复到页面上的位置

问题：这会造成非常糟糕的

闪烁

，因为滚动条被捕捉的次数太多了

解决方案：使浏览器在散列更改时不尝试恢复其滚动位置

我怎么知道这会起作用？当我在网站上设置按钮/链接来执行上述操作时，不会出现闪烁，因为浏览器不会自动尝试向下滚动。为什么不能在网站上设置我自己的后退按钮？人们真的很喜欢他们的浏览器后退按钮，闪烁真的很烦人

我在下面包含了一些代码，但我认为没有必要查看：

// called when a folder is clicked
function hide_main() {
    window.scroll_top = $(window).scrollTop();

    $('#favorite_container').hide();
    $('#top_div > h2.favorite_main').hide();
}

// called when the user wants to go back to the main page that lists all the folders
function show_main() {
    $$.vars.lock = true;

    $('#top_div > h2.favorite_other').remove();
    $('#thumbs').empty();

    $('#top_div > h2.favorite_main').show();
    $('#favorite_container').show();

    $('html, body').scrollTop(window.scroll_top);
}

那么，我该如何阻止浏览器执行其默认行为，即滚动到以前按下“后退”按钮时的位置？

您可以将其设置为使主体不滚动；只有主体内的元素才会滚动。e、 g

<body>
    <div id="content">
    </div>
</body>

#content {
    position:absolute; top:0; left:0; bottom:0; right:0;
    overflow-y:scroll;
}


#内容{
位置：绝对；顶部：0；左侧：0；底部：0；右侧：0；
溢出y：滚动；
}

因此，浏览器将始终认为主体处于0%滚动状态。

这将导致

#content

div上有滚动条，对吗？这看起来比闪烁更糟糕，但谢谢你的尝试（：@Conner:我不认为这是真的。如果你的页面不需要滚动条，它就不会有滚动条（例如，如果需要，你可以设置

溢出：隐藏）。如果您不使用此方法，它将在您使用滚动条的位置显示滚动条。它实际上与不使用此技术的滚动条无法区分。除非它可能会愚弄浏览器，使其不在后退按钮上滚动。感谢您的响应，但请确保改为使用@Connor，这样我会收到通知：）我会尝试，但我很确定，除了标准文档之外，这将为div本身创建另一个滚动条scrollbar@Connor：此处的想法是删除标准文档滚动条，并将其替换为人造滚动条，使其他所有内容保持不变。在页面上保留另一个滚动条真的不会从设计角度考虑：(