【问题标题】:Javascript file not loading from layout in viewJavascript文件未从视图中的布局加载
【发布时间】:2020-02-27 16:59:28
【问题描述】:

我正在尝试加载一个剑道网格,我的jQuery 文件中有一个方法来初始化它,但我的问题是由于某种原因我的grid.js 文件没有被加载到页面上。

引用grid.js文件的布局文件:

<script defer src="~/js/grid.js" asp-append-version="true"></script>

@section Scripts {
    @RenderSection("Scripts", false)
}

我的视图引用了布局文件:

@{
    Layout = "~/Views/Shared/_LayoutList.cshtml";
}

当我使用开发工具检查源中的脚本时,找不到它,但正在加载引用其他位置的其他 .js 文件。

更新
我的_LayoutList.cshtml 的布局来自_Layout.cshtml。我测试了将&lt;script&gt; 标记移动到_Layout.cshtml 并且grid.js 文件终于在我的源中。我显然不能让加载的每个页面都有grid.js 文件,所以我仍然需要弄清楚为什么_LayoutList.cshtml 没有使用grid.js

编辑:
我尝试从我的&lt;script&gt; 标签中删除defer,使其成为
&lt;script src="~/js/grid.js" asp-append-version="true"&gt;&lt;/script&gt;
不幸的是,这并没有解决问题。

我还检查了控制台是否有错误,但没有发现任何错误。

编辑:
我尝试以隐身模式打开窗口以避免页面的缓存版本。没有解决我的问题。

【问题讨论】:

  • 尝试删除defer。取决于您的页面的结构,这可能会导致比它解决的问题更多的问题。如果失败,请检查控制台是否有错误
  • @RoryMcCrossan,刚刚测试过,不幸的是没有解决我的问题。检查控制台是否有错误,不存在。
  • 在 devtools 中,您可以检查网络选项卡并查看对 grid.js 文件的请求发生了什么
  • @rbansal 对于网络选项卡中的脚本,我在页面上看到了我调用的其他脚本,但没有看到 grid.js 文件。
  • 你的意思是没有调用网络中的文件获取?

标签: javascript c# jquery asp.net-core kendo-grid


【解决方案1】:

在这段代码中:

@section Scripts {
    @RenderSection("Scripts", false)
}

您正在声明一个名为“脚本”的部分,该部分呈现另一个名为“脚本”的部分...

您无需致电@RenderSection 您在布局页面上执行此操作。随便写:

@section Scripts {
    <script src="~/js/grid.js" asp-append-version="true"></script>
}

您可能想要删除 asp-append-version 标记并只调用您拥有的确切文件名,因为它可能使用不正确的名称调用脚本。

【讨论】:

  • 你试过删除~/,让js/grid.js吗?
  • 只有一条评论。 @RenderScript 指令只能由布局页面调用,您应该在具有该布局的其余页面中指定 @Section Scripts。我知道您的问题尚未解决,但您使用@section Scripts 的方式不正确。你在使用System.Web.Optimization 吗?
  • 这就是我想说的。 @RenderSection 应该是 only 在布局和 page 应该只是 @section Scripts { 和你的 &lt;script&gt; 标签。您将在布局中使用System.Web.Optimization,或在页面顶部使用ViewImports.?html 或任何其他带有@using 指令的视图。
  • 您需要导入程序集或通过 Nuget 安装它。无论如何,在我看来,您的问题似乎是这两种布局可能调用了两个具有相同名称的@RenderSection
  • 好的。你不需要安装它。您正在使用 webpack。在这一点上,我不确定你有什么。我需要查看该项目以进一步帮助您。在一天结束时,您只有一页。布局中的部分名称应该是唯一的。因此,您可以调用 ut ListScripts 或类似名称,而不是调用它 Scripts。我个人的偏好是只有一个页面布局而不嵌套以避免任何类型的问题,但嵌套布局应该可以工作。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2018-09-19
  • 2023-03-15
  • 1970-01-01
  • 2011-07-03
  • 2022-01-02
  • 1970-01-01
相关资源
最近更新 更多