所以我有这个页面，其中有一些基本的自定义选项卡:
http://demo.unlockedmanagement.com/users/view/2
*注意，它会要求登录，只需使用管理员/密码，然后转到该网址。
正常加载此页面(第一次除外)，一切看起来都很好。如果我对此页面进行硬刷新，选项卡/选项卡式内容将显示为好像尚未应用 javascript，而 javascript 似乎仅在加载图像后才应用。问题是我应用选项卡的 javascript 看起来像这样(您可以查看/javascript/base.js 以查看整个内容):
$(document).ready(function ()
{
//some code ...
//tabbed data
if($('.tabbed-data').length > 0)
{
$('.tabbed-data').tabs();
}
//some more code ...
});
我认为使用 $(document).ready() 不会等待所有图像加载，那么为什么我在执行硬刷新的 javascript 中看到延迟？
最佳答案
您使用的脚本是正确的，$(document).ready()仅等待 DOM 加载。它不会等待图像加载。因此，问题很可能与加载脚本的位置有关。
在您的代码中，您已放置 <script>代码底部的标签。这是为什么？这很可能是问题所在，因为浏览器将按照页面显示的顺序加载资源。
给你定位<script> <head> 中的标签页面的一部分，在图像之前加载它们。
测试这是否是问题的最佳方法，只需将其放入 header 中，然后查看它是否在图像加载之前触发:
<script>
$(document).ready(function ()
{
//some code ...
//tabbed data
if($('.tabbed-data').length > 0)
{
$('.tabbed-data').tabs();
}
//some more code ...
});
</script>
关于Javascript (jQuery) 效果等待图像加载，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/9989443/