添加到 _Layout 的脚本在视图页面中不起作用答案

【问题标题】：Scripts added to _Layout don't work in view page添加到 _Layout 的脚本在视图页面中不起作用
【发布时间】：2020-01-27 06:05:44
【问题描述】：

我将所有样式和脚本添加到 _Layout，我的视图样式没有问题，但问题是脚本在视图中不起作用。例如，我将 jquery 添加到 _Layout，但在视图中，如果我调用 jquery 的任何函数，它会显示“$ 未定义”。这意味着 jquery 不会添加到我的视图中。我也应该将 jquery 添加到我的视图中。我尝试使用 Bundle，但在这种情况下，即使我的风格也不起作用。它们都不适合我。

public class BundleConfig
{


    public static void RegisterBundles(BundleCollection bundles)
    {
        bundles.Add(new ScriptBundle("~/bundels/base/Jquery").Include(
            "~/MyContent/Bootstrap4/bootstrap4/jquery-3.2.1.min.js"

        ));
        bundles.Add(new ScriptBundle("~/bundels/base/BootstrapJs").Include(
           "~/MyContent/Bootstrap4/bootstrap4/popper.min.js",
           "~/MyContent/Bootstrap4/bootstrap4/bootstrap-4.0.0.js"
       ));

        bundles.Add(new ScriptBundle("~/bundels/base/MyJs").Include(
            "~/MyContent/Bootstrap4/SidebarMenu/sideBarMenuJs.js",
            "~/MyContent/Bootstrap4/menuBar/menuBarJs.js",
            "~/MyContent/Bootstrap4/customerSlider/customerJs.js",
            "~/MyContent/Bootstrap4/VideoIntro/videoJs.js",
            "~/MyContent/Bootstrap4/table/tableJs.js",
            "~/MyContent/Bootstrap4/commentSlider/CommentSlider.js",
            "~/MyContent/Bootstrap4/Header/headerJs.js",
            "~/MyContent/Bootstrap4/General/generalJs.js"
        ));
        bundles.Add(new StyleBundle("~/bundels/base/bootstrapcss").Include(
          "~/MyContent/Bootstrap4/bootstrap4/bootstrap-4.0.0.css",
          "~/MyContent/Bootstrap4/IcoFont/icofont.css"
       ));
        bundles.Add(new StyleBundle("~/bundels/base/MyCss").Include(
           "~/MyContent/Bootstrap4/SidebarMenu/sidebarmenuStyle.css",
           "~/MyContent/Bootstrap4/table/TableStyle.css",
           "~/MyContent/Bootstrap4/menuBar/menuBarStyle.css",
           "~/MyContent/Bootstrap4/General/style.css",
           "~/MyContent/Bootstrap4/customerTab/customerTabSlider.css",
           "~/MyContent/Bootstrap4/customerSlider/customerSlider.css",
           "~/MyContent/Bootstrap4/Header/headerStyle.css",
           "~/MyContent/Bootstrap4/VideoIntro/VideoIntroStyle.css",
           "~/MyContent/Bootstrap4/footer/FooterStyle.css"
        ));

        BundleTable.EnableOptimizations = true;
    }
}
public class MvcApplication : System.Web.HttpApplication
{
    protected void Application_Start()
    {
        AreaRegistration.RegisterAllAreas();
        RouteConfig.RegisterRoutes(RouteTable.Routes);
        BundleConfig.RegisterBundles(BundleTable.Bundles);
    }


}

我叫他们

@Styles.Render("~/bundels/base/bootstrapcss");
@Styles.Render("~/bundels/base/MyCss");
 @Scripts.Render("~/bundels/base/Jquery");
 @Scripts.Render("~/bundels/base/BootstrapJs");
 @Scripts.Render("~/bundels/base/MyJs");

这是我的 _Layout 的示例：

  <!DOCTYPE html>
<html>
<head>



 <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
</head>

<body class="persianumber" style="direction: @($"{(lang?.ToLower() == "fa" ? "rtl" : "ltr")}")">

<header class="border-bottom">

</header>
<nav class="container-fluid bg-white sticky-top d-block d-lg-none ">

</nav>



@RenderBody()



<section class="container-fluid pb-5  bg-black">

</section>
<section class="container-fluid pb-5  footer-top">

</section>
<footer class="container-fluid bg-dark">

</footer>
<script src="~/MyContent/js/jquery-3.2.1.min.js?v=" @Sessions.UpdateVersion></script>

<script src="~/MyContent/js/popper.min.js?v=" @Sessions.UpdateVersion></script>

<script src="~/MyContent/js/bootstrap-4.0.0.js?v=" @Sessions.UpdateVersion></script>

<script src="~/MyContent/SidebarMenu/sideBarMenuJs.js?v=" @Sessions.UpdateVersion></script>

</body>
</html>

我错过了什么吗？

【问题讨论】：

您是否在浏览器中检查了页面，是否真的添加了？
您添加渲染的位置也很重要，您能否在实际位置显示相关视图代码
是的。它补充说。例如，所有引导函数（如 modal ）在视图中都可以正常工作。

标签： jquery html css asp.net-mvc

【解决方案1】：

从包中移除优化

BundleTable.EnableOptimizations = true;

如果它有效，请尝试在没有优化的情况下调用 jquery

【讨论】：