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

Question

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

意外的行为是在页面加载时 offsetTop 似乎没有得到计算或值被覆盖。

当我打电话时 console.log($("#section").offset());
来自加载的 PHP 文件的 <script> 标签，
或在 jQuery(document).ready(function() {})、
或$(window).on('load', function() {})

所有结果都在 { top: 0, left:0 } 的控制台日志中。

然而，一旦加载文件，我手动打开 Dev Tools 并输入 console.log($("#section").offset());，它 returns 是 { top:200px, left: 200px } 的预期输出。 - 当我在不调用 LESS 文件的情况下加载页面时，计算就会发生。这让我相信这是 LESS 的竞争条件。然而，LESS 会打架并覆盖 html:5 函数，这似乎很奇怪。

Answer 1

与 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>

Answer 2

将一个简单的 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>

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

On Page Load Offset Value set to 0. On Inspection value is calculated

javascript

jquery

race-condition

less