Bootstrap.js 未在 nopcommerce 3.10 中加载答案

【问题标题】：Bootstrap.js is not loading in nopcommerce 3.10Bootstrap.js 未在 nopcommerce 3.10 中加载
【发布时间】：2015-05-09 20:55:50
【问题描述】：

我在 nopcommerce 的 _Root.Head.cshtml 页面中添加了引导链接。但我的浏览器显示“未捕获的类型错误：未定义不是函数”，用于以下功能，包括引导带。请帮助我如何启用引导带和其他功能。

Html.AppendCssFileParts("~/Content/jquery-ui-themes/smoothness/jquery-ui-1.10.0.custom.min.css");
    Html.AppendScriptParts("~/Scripts/jquery-1.7.1.min.js");
    Html.AppendScriptParts("~/Scripts/public.ajaxcart.js");
    Html.AppendScriptParts("~/Scripts/public.common.js");
    Html.AppendScriptParts("~/Scripts/jquery-ui-1.10.0.min.js");
    Html.AppendScriptParts("~/Scripts/jquery.validate.unobtrusive.min.js");
    Html.AppendScriptParts("~/Scripts/jquery.validate.min.js");
    Html.AppendScriptParts("~/Scripts/jquery.unobtrusive-ajax.min.js");
    Html.AppendScriptParts("~/Scripts/js/bootstrap.js");

注意：以下图片是四张分开的图片。

以下内容来自浏览器源。注意：这里 bootstrap.js 在 jquery-1.7.1.min.js 之前加载。

<link href="/Themes/DefaultClean/Content/globalstyle.css" rel="stylesheet" type="text/css" />
<link href="/Themes/DefaultClean/Content/bootstrap-responsive.css" rel="stylesheet" type="text/css" />
<link href="/Themes/DefaultClean/Content/bootstrap.css" rel="stylesheet" type="text/css" />
<link href="/Themes/DefaultClean/Content/styles.css" rel="stylesheet" type="text/css" />
<link href="/Content/jquery-ui-themes/smoothness/jquery-ui-1.10.0.custom.min.css" rel="stylesheet" type="text/css" />

    <script src="/Scripts/js/bootstrap.js"></script>
<script src="/Scripts/jquery-1.7.1.min.js"></script>
<script src="/Scripts/jquery.unobtrusive-ajax.min.js"></script>
<script src="/Scripts/jquery.validate.min.js"></script>
<script src="/Scripts/jquery.validate.unobtrusive.min.js"></script>
<script src="/Scripts/jquery-ui-1.10.0.min.js"></script>
<script src="/Scripts/public.common.js"></script>
<script src="/Scripts/public.ajaxcart.js"></script>
<script src="/Scripts/slimbox2.js"></script>

【问题讨论】：

你的脚本在@section Scripts {} 部分吗？
感谢您对@Alundrathedreamwalker 的关注。是的，我将这些脚本放在了 @{} 标签中。
看起来你在引用你的 bootstrap.js 两次。您只需要包含对每个 css 和 js 文件的一个引用
抱歉，这是一个发布错误。现在我纠正了它。为了您的信息，我添加了浏览器源代码的新代码。这里 bootstrap 在 jquery 之前加载。我怎样才能让它在 jquery 之后加载？
你在使用样式包吗？如果您不确定，请检查您的共享布局

标签： jquery asp.net-mvc twitter-bootstrap popover nopcommerce

【解决方案1】：

NopCommerce 的“AppendScriptParts”（它是 NopCommerce 提供的 MVC Html 对象的扩展）不会按照脚本的添加顺序呈现脚本。

事实上，它是颠倒的。它将每个脚本部分添加到列表的开头：

// excerpt from Nop.Web.Framework/UI/PageHeadBuilder.cs : AppendScriptParts
_scriptParts[location].Insert(0, new ScriptReferenceMeta
{
    ExcludeFromBundle = excludeFromBundle,
    Part = part
});

然后按顺序渲染它们：

// excerpt from Nop.Web.Framework/UI/PageHeadBuilder.cs : GenerateScripts
var result = new StringBuilder();
foreach (var path in _scriptParts[location].Select(x => x.Part).Distinct())
{
    result.AppendFormat("<script src=\"{0}\" type=\"text/javascript\"></script>", urlHelper.Content(path));
    result.Append(Environment.NewLine);
}
return result.ToString();

您可以在其他调用之前添加对 bootstrap.js 的调用 RenderScriptParts，或者您始终可以直接在 _Root.head.cshtml 中的 @Html.NopScripts(this.Url, ResourceLocation.Head) 调用下插入对 bootstrap.js 的调用。您也可以在脚本 src 属性中使用“~”。

@Html.NopScripts(this.Url, ResourceLocation.Head)
<script src="~/Scripts/js/bootstrap.js"></script>

或

@Html.NopScripts(this.Url, ResourceLocation.Head)
<script src="@Url.Content("~/Scripts/js/bootstrap.js")"></script>

（在较新的 NopCommerce 版本中使用第一个替代方案）

【讨论】：