Question

目标是在页面加载时使用URL fragid跳转到单独页面上的特定部分。 <a href="page.php#section>

意外的行为是，在页面加载时，offsetTop似乎无法计算或值被覆盖。

当我致电console.log($("#section").offset());
通过已加载的PHP文件的<script>标记
或调用jQuery(document).ready(function() {})
或$(window).on('load', function() {})

all导致控制台日志为{ top: 0, left:0 }。

但是，一旦文件被加载，我将手动打开Dev Tools并输入console.log($("#section").offset());，它会返回{ top:200px, left: 200px }的预期输出。 -当我加载页面而不调用LESS文件时，就会进行计算。这使我相信这是LESS的比赛条件。但是，LESS会与之战斗并覆盖html：5函数，这似乎很奇怪。

Answer 1

将简单的URI查询组件附加到锚点的href属性的值。

<a href="page.php?hash=section">Click here</a>

然后，在page.php上添加代码以处理GET请求中的URI查询。

<!-- at bottom of markup just before end body -->
<?php if (@$_GET['hash'] === 'section') echo '<script>window.location.hash="section";</script>'; ?>
</body>

Answer 2

使用javascript

window.onload = function (){
  "use strict";
document.body.addEventListener("load",function(){
    // your code here   
 });
}

使用jQuery很简单

$("body").on("load",function(){
  // here code
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

页面加载偏移值设置为0。计算检查值

2 个答案: