通过AJAX加载的HTML内容无序加载外部JavaScript

Question

这是一个场景，不知道我错过了什么。

• 页面A.htm对页面B.htm发出ajax请求，并将响应插入到页面中。

• 页面B.htm包含指向其他几个JS文件的链接，其中许多文件包含一个document.ready（）函数来初始化它们。

当A.htm和B.htm在同一台服务器上但在不同服务器上时，这种方法很好。

我想到我在这里看到的是，当页面A和B位于不同的服务器（跨域ajax）上时，外部资源是异步返回的，或者至少是顺序，所以脚本正在执行期望JQuery.UI已经加载，当它不是。

感谢任何指针或建议。对于糟糕的解释道歉。

Answer 1

您正在通过jQuery注入HTML +脚本标记。在这种情况下*：

• 除脚本之外的HTML内容将在文档中注入
• 然后逐个执行所有脚本
• 如果脚本是外部的，那么它将被下载并异步执行

因此，依赖于jQuery UI的外部或内联脚本可能会在jQuery UI之前执行。

一种可能的解决方案是改变页面的工作方式：

• 在pageb.html中删除外部脚本但保留内联脚本
• 在pagea.html中加载所需的脚本
• 加载pageb.html

另一种解决方案是推出自己的jQuery函数：

• 从HTML
中删除所有<script src>个元素
• 按顺序下载并执行这些脚本
• 注入剩余的HTML

^{*没有记录确切的行为。我不得不调查source code来推断细节。}

Answer 2

您的印象是正确的，即问题是跨域处理请求的方式不同。

这是一个让您走上正确轨道的链接：How to make synchronous JSONP crossdomain call

但是，您必须在某种程度上重新构建您的解决方案，以便在继续之前检查资源是否已加载。有很多解决方案（见链接）

您可以设置一个计时器间隔并检查dom中的某些内容，或者另一个合理的解决方案（尽管它缺乏效率）是创建一个＆＃34;代理＆＃34;服务器上的serverside（例如php）文件，让该文件执行跨域请求，然后吐出结果。

请注意，由于jquery UI是一个相当大的文件，因此可以想象跨域请求首先完成，并立即执行，即使尚未加载jqueryUI。在任何情况下，您都必须开始考虑让您的应用做出反应而不是遵循顺序。