未加载Javascript库以用于页面加载的部分视图

Question

我正在构成表格的视图中的选项卡上实现延迟加载功能。

但是，有时在ModelState错误的情况下视图不会被延迟加载，在这种情况下，我正在调用Html.Action()来检索视图。

为了做到这一点，我正在询问模型，以查看相关属性是否为空：

@if (Model.CaseDetails != null)
{
    @Html.Action("LoadCaseDetails", new { id = Model.CaseManagement.Id, model = Model.CaseDetails })
}
else
{
    //Empty as later added in with ajax call
}

当我稍后在Ajax视图中执行此操作时，效果很好，但是如果视图是随页面一起加载的，则相关Javascript库尚未加载，因此依赖该库的JavaScript将失败。

除了在页面开始时加载js库之外，如何解决此问题？

请注意，我无法轻易将javascript放到主视图中，因为它依赖于仅在呈现视图时才加载的数据，并且要添加到该视图中，我的实际要求比我所允许的更为复杂（我们很懒惰在其他延迟加载标签内的标签中加载），因此这种方法实际上并不可行。

Answer 1

您必须推迟执行JavaScript。 有很多方法可以做到这一点。 但是，最好的选择是使用JS模块加载库，例如RequireJS 。 您将需要进行一些初步的工作来熟悉它的工作原理和设置配置，但是一旦完成，它将无限地具有更好的可维护性和功能性。

最简单的方法（尽管可能不是最好的方法）不是简单地使用window.onload ：

(function () {
    var onload = window.onload;
    window.onload = function () {
        onload();

        // put your js code here that should only happen when everything is loaded
    };
})();