php - 如何链接到动态创建的其他页面？

Question

我有一个 services.php 页面，我使用 for 循环使用 MySQL 数据库中的信息创建页面的不同服务内容。

<?php for ($i=0; $i < $numberOfRecords; $i++) { ?>

<div class="download-div">

    //this line below creates the anchor with the correct id
    <a id="<?= $scroll ?>" name="<?= $scroll ?>"></a>
    <h1><?= $service[$i] ?></h1>
    <p><textarea spellcheck="true" class="service-text" name="description<?= $i ?>"><?= $description[$i] ?></textarea></p>
    <p class="current-file">Current file: <?= $image[$i] ?></p>
    <input type="file" class="browse" name="image<?= $i ?>">
    <div class="img-wide">
        <img src="upload/<?= $image[$i] ?>">
    </div>

</div>

<?php } ?>

循环创建了 10 个不同的服务部分，每个部分都有服务名称、描述和图像。

当我点击另一个页面(即 <'a href="services.php#reforestation">)上的 anchor 标记时，它应该链接到每个部分中的 a 标记的 id，它只是转到services.php 页面的顶部。但是，当我再次单击该链接时，它会转到我希望它转到的页面部分。 (即 <'a id="reforestation"name ="reforestation">)

就好像浏览器在页面加载/创建之前看不到 anchor ID。然后一旦它被加载，一旦我点击 anchor 标签，它就会转到我想要的页面区域。

有办法解决这个问题吗？

Answer 1

因为它正在导航到另一个页面。我会在页面上使用 javascript 来检查 Windows 地址栏中是否有哈希值。下面的函数可以提取该哈希值。

window.onload = function() {
  if(window.location.hash) {
    var hash = window.location.hash;
    return hash.substring(1); // remove #
    //Once you have this hash you can scroll your page to that element
    location.hash = "#" + hash;
  }
}

如果你更喜欢上面的功能，你可以使用类似下面的东西

function scrollTo(hash) {
  location.hash = "#" + hash;
}

function getHash() {
  var hash = window.location.hash;
  return hash.substring(1); // remove #
}

window.onload = function() {
  if(window.location.hash) {
    scrollTo(getHash());
  }
}