javascript - YepNope - 等待依赖项加载

标签 javascript asp.net asynchronous master-pages yepnope

在 ASP.NET 母版页中,我使用 YepNope 无条件异步加载 jQuery(来自 Google CDN,具有本地回退)和一些在站点中所有页面上使用的脚本。在 MasterPage 中,我在结束正文标记之前(以及在加载所有页面上使用的那些脚本的 YepNope 脚本下方)创建了一个 ContentPlaceHolder,用于单个页面上使用的脚本。由于 jQuery 应该在网站的每个页面上都可用,因此不应在有使用它的特定脚本的页面上单独加载它。

我遇到的问题是,我无法在加载 jQuery 的 yepnope 脚本中使用回调或完整函数,因为这是在 MasterPage 上,这些是仅在该页面上使用或添加的单独页面脚本,但我需要能够延迟各个页面脚本的执行,直到 yepnope(出现在页面脚本上方)完成加载其中使用的任何依赖项(例如 jQuery)。

我能想到两个选择-

1- 将页面上使用的脚本设为外部文件并使用语法加载 -

yepnope('/url/to/your/script.js'); 

yepnope({ load: '/url/to/your/script.js' });

我不确定我是否喜欢这个想法,因为它为几行 javascript 引入了额外的 HTTP 请求,而该请求不会在任何其他页面上使用。

2- 在另一个 yepnope 测试对象 block 中再次加载 jQuery,使用完整的函数包装页面脚本(在加载之前的脚本之前调用完整的函数似乎会立即执行该函数)并依赖于以下内容 -

I am requesting a file twice and it's only loading once? By popular demand, in yepnope 1.5+ we added the feature that scripts that have already been requested not be re-executed when they are requested a second time. This can be helpful when you are dealing with less complex serverside templating system and all you really care about is that all of your dependencies are available.

在页面中,我大概可以从 Google CDN 加载相同版本的 jQuery,基于上面的内容实际上不会加载两次,然后在从 yepnope 的完整函数调用的匿名函数中加载页面脚本测试对象。<​​/p>

从好的方面来说,这意味着页面不再依赖于从 MasterPage 加载的 jQuery,但消极的一面是(即使假设 YepNope 现在不会加载脚本两次)我们将加载多个版本的jQuery 应该更改 MasterPage 中的版本,而将来页面中不会发生同样的情况。从维护的 Angular 来看,我认为这不是一个好主意,特别是假设(我认为您应该始终这样做)另一位开发人员将是进行更改的人。

它看起来也不是特别优雅。

总的来说,我几乎肯定会使用第一个选项,但我想知道是否有办法延迟或延迟页面上的脚本,直到异步加载完成,而这不能作为 YepNope 测试对象的一部分来完成加载资源。

其他开发人员如何解决这个问题?

最佳答案

我想出了这个作为我很喜欢的解决方案。

在 MasterPage YepNope 测试对象中添加代码-

complete: function() {
                if (window.pageFunctions !== null && typeof (window.pageFunctions) === "function") {
                    window.pageFunctions();
                }
            }

如果我想添加任何依赖于 MasterPage 中加载的依赖项的 JavaScript 代码或函数,我只需将它们包装在名为“pageFunctions”的函数中,如下所示 -

<script type="text/javascript">
    function pageFunctions() {
        $(document).ready(function () {
            ...
        });
    }
</script>

我仍然对其他(可能更好)的解决方案感兴趣,因此我将把这个问题留待几天。

我也非常感谢对此解决方案的评论。

关于javascript - YepNope - 等待依赖项加载,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14923645/

相关文章:

c# - 系统.Data.SqlClient.SqlException : Invalid column name 'Gender_id'

multithreading - 不能将 Worker-Loader 与 Vuejs 和 Webpack 一起使用

一旦内容可用,Java 就会从 Stream 中读取

javascript - 在 Chrome 上使用 Jquery 禁用网站的默认热键

javascript - ng-repeat 不工作 AngularJS

javascript - SystemJS - TypeScript 加载器用例

c# - 在 dotnet 的 Controller 中包含自定义类时调用工厂

javascript - 我如何将javascript变量发送到php文件并将其保存在数据库中

c# - Global.asax - Application_Error - 如何获取页面数据?

multithreading - Node 线程是否是模拟循环的错误位置?