Question

我有一些代码在我的网站上异步加载广告，如下所示：

<div id="ad-div"></div>
<script>function onAdReady() {
    debug_log('Method onAdReady called');
    new Ad(document.getElementById("ad-div"))
}
</script>
<script src="http://content.xxxxx.com/ads/ads.min.js" async onload="onAdReady()"></script>

问题是onAdReady函数永远不会被调用。原因可能是包含此代码段的html代码首先通过javascript加载，如下所示：

// Initiate out_window_view
$.ajax({
    url: loadPagePath("main.html"),
    success: function (result) {
        debug_log("Going in main.html view");
        $("#content").html(result);
    },
    error: function (result) {
        debug_log("Error, failed to load out_window_main view");
    }
});

如果可能有问题，此代码将在$(document).ready(function () {]中执行。任何人都可以告诉我为什么这不起作用并为我提供解决此问题的解决方法或替代方法？

Answer 1

我不明白为什么需要将async添加到ajax生成的内容中。 async脚本的目的是允许浏览器继续解析文档而无需等待脚本完全加载。在脚本加载完成之后和DOMReady之前立即调用onload事件。换句话说，在之后 async的{{1}}将不。

当您将代码段添加到页面时，页面已经完成解析，因此不会触发async onload事件。

解决方案IMO将删除onload部分，并在async同步后调用该函数。

Answer 2

您想在加载页面时加载广告吗？

您在调试工具的网络选项卡中看到了什么（firebug或Chrome / Firefox中的F12）？

你在哪里打电话给$（文件）.ready（）？

https://learn.jquery.com/using-jquery-core/document-ready/

您能告诉我您何时想发送HTTP请求吗？

Answer 3

如果能够以编程方式添加脚本，则默认情况下为async（引用为here），并且您可以收听onload或onreadystatechange事件（如您所读here，IE11不支持onreadystatechange）。这是一个示例：

var setup = function(){
  console.log('the script has been parsed');
};

var script = document.createElement("script");
script.src = "http://content.xxxxx.com/ads/ads.min.js";

document.getElementsByTagName("head")[0].appendChild(script);

// standard browser
script.onreadystatechange = function (){
  if (this.readyState == 'complete'){
     setup();
  }
}
// IE
script.onload = setup;

async onload在这种情况下不起作用

3 个答案: