Question

在我的网页上，我有这样的脚本：

<head>
<script src="scripts/effect.js"></script>
<script>
if (document.readyState == 'complete') {
  doOnLoad();
}
$(window).bind("load", doOnLoad);
function doOnLoad() {
    console.log("here..");
}
</script>
</head>

effect.js 文件包含如下所示的脚本：

$( document ).ready(function(){
    console.log("yes");
   // here I've script for reading a text file using ajax and manipulating the result from text file
    $.ajax({
      // code goes here
      console.log("ajax");
    });
});

问题是，当我最初运行页面时，我没有得到结果。那时我得到控制台输出

yes
here..
ajax

但是当我再次刷新页面时，我得到的结果和控制台打印如下：

yes
ajax
here..

如何在window.load完成后运行document.ready。

任何人都可以帮我解决这个问题吗？提前谢谢。

Answer 1

这完全是关于脚本执行的时间。一旦某些资源被加载和缓存，这听起来就像是在改变行为。

您拥有的第一段代码有点令人困惑：

if (document.readyState == 'complete') {
    doOnLoad();
}

我不确定为什么你需要这个和on load handler一样？看起来这个条件永远不会等于真，因为该代码将在文档加载完成之前立即运行。至少，我会在这个块中放入一个console.log，这样我就能确定触发doOnLoad的是什么。

尝试替换页面上的脚本以获取以下内容：

$(window).on("load", doOnLoad);
function doOnLoad() {
    console.log("here..");
}

刷新页面后脚本正确执行 - jquery

1 个答案: