使用php动态创建页面滚动到锚标记答案

【问题标题】：Scrolling to Anchor Tag with php dynamically created page使用php动态创建页面滚动到锚标记
【发布时间】：2012-11-19 08:55:03
【问题描述】：

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

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

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

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

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

【问题讨论】：

相当复杂。我将致力于创建独立的 php 代码，看看是否可以复制它。
那太好了。如果没有看到任何关于您的问题的具体信息，很难提供帮助 - 现在唯一可以帮助您的是那些遇到完全相同问题的人。
嗯，这些可能是显而易见的，但是，有些浏览器在跳转到锚点之前需要一段时间（特别是如果你有很多内容）或者可能是格式错误的锚点标签？或者，如果您使用的是 javascript，则滚动事件可能在页面加载之前触发得太早
我已经弄清楚了。有时需要发布一个问题来了解如何调试它。我发现我有一个 java 脚本 onload 滚动到 0 并与锚点冲突。感谢您发布代码的鼓励。

标签： php anchor

【解决方案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>

【讨论】：

【解决方案2】：

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

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

【讨论】：