使用php动态创建的页面滚动到锚标签

Question

我有一个页面，其中从表中读取条目，然后 php 生成显示每一行的 div - div 的名称和 id 被设置为基于记录 # 的唯一字符串。 例如：

当页面加载时，它传递记录的唯一锚字符串以如下格式滚动：href='showpost.php#g50'

当页面加载时，它会正确显示带有锚点的 url，但它不会滚动。

但是，如果我将光标放在浏览器的地址栏上并按<Enter> ，页面会正确滚动到记录。 奇怪的是， <F5>和<Ctrl-R>不起作用（Firefox 16）。

我猜测动态创建的页面与它有关。 任何想法可能会发生什么？

Answer 1

您始终可以只使用简单的 javascript 调用来滚动到锚点。 您可以从页面的任何位置调用 Javascript 代码，因此为了安全起见，您可以在 PHP 生成所有锚点后将其放在页面的末尾。

<?php 
    // php generation code here
?>
<script type="text/javascript">
    var hashSplit = location.href.split('#');
    var curHash= hashSplit[1];
    window.location.hash = curHash;
</script>

或者，如果您已经通过 php 知道页面的锚点是什么，您可以更轻松地做到这一点。

<?php
    $anchor = "home";
?>
<script type="text/javascript">
    window.location.hash = "<?= $anchor; ?>";
</script>

Answer 2

非常有用的例子，感谢 SISYN。 但我有我的版本

let hashSplit = location.href.split('#');
let curHash = hashSplit[1];
if(typeof curHash !== 'undefined') {
    $('html, body').animate({
        scrollTop: $('#' + curHash).offset().top
    }, 1000);
}