0
我最近已經注意到，當我的佈局文件的自舉導航欄切換到適合移動設備的摺疊變體時，用於展開/顯示導航鏈接的按鈕表現得非常奇怪，這樣做完全無法使用。Boostrap導航菜單立即消失點擊移動/小屏幕尺寸
當我點擊按鈕展開菜單時，它展開，顯示足夠長的動畫以顯示列表中的每個項目，然後立即關閉。
第二次點擊只是顯示一個簡短的動畫，出現一條白線 - 我最好的猜測是這是關閉動畫播放，但沒有關閉菜單。
第二次點擊後，行爲將以相同的模式重複。
我不確定我會改變什麼，可能會導致這種情況，除了可能搞亂我的JavaScript/CSS加載的順序，但我在前面做的搜索似乎與什麼是一致的我做我的包，在這裏：
public class BundleConfig
{
public static void RegisterBundles(BundleCollection bundles)
{
bundles.Add(new ScriptBundle("~/bundles/scripts").Include(
"~/Scripts/modernizr-*",
"~/Scripts/jquery-3.1.1.min.js",
"~/Scripts/bootstrap.min.js",
"~/Scripts/respond.min.js",
"~/Scripts/jquery.validate.min.js*",
"~/Scripts/jquery.validate.unobtrusive.min.js",
"~/Scripts/jquery.unobtrusive-ajax.min.js",
"~/Scripts/navbarLinksCurrentColor.js",
"~/Scripts/ajaxCallWithLoadingIcon.js"
));
bundles.Add(new StyleBundle("~/Content/css").Include(
"~/Content/bootstrap.min.css",
"~/Content/styles.css"));
BundleTable.EnableOptimizations = true;
}
}
束配置裝載以標準方式，Global.asax中的內部：
protected void Application_Start()
{
AreaRegistration.RegisterAllAreas();
GlobalConfiguration.Configure(WebApiConfig.Register);
FilterConfig.RegisterGlobalFilters(GlobalFilters.Filters);
RouteConfig.RegisterRoutes(RouteTable.Routes);
BundleConfig.RegisterBundles(BundleTable.Bundles);
if (!File.Exists(LogFilePath))
File.Create(LogFilePath);
}
這些包裝以這種方式在我的佈局視圖，這裏：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" name="viewport" content="width=device-width, initial-scale=1" />
@Styles.Render("~/Content/css")
@Scripts.Render("~/bundles/scripts")
</head>
<body>
<header>
@{Html.RenderPartial("NavigationMenu");}
</header>
<div class="body-content container-fluid">
@RenderBody()
</div>
<footer>
</footer>
<div id="processing"
class="processingIcon">
<h2>Loading...</h2>
</div>
@RenderSection("scripts", required: false)
</body>
</html>
正如你所看到的，佈局視圖調用一個局部視圖來渲染導航菜單：
<nav class="navbar navbar-default navbar-fixed-top">
<div class="container-fluid">
<div class="navbar-header">
@*I originally was using the 4-span style that I've seen
commonly for the collapse button, but switched to a glyphicon
approach to simplify things as well as see if it would fix the
issue - it did not, so I don't think it is relevant to this issue*@
<button type="button" class="navbar-toggle collapsed glyphicon glyphicon-menu-hamburger"
data-toggle="collapse" data-target="#navbarLinks"></button>
<a class="navbar-brand" href="/">Hire Right Testing</a>
</div>
<div class="collapse navbar-collapse" id="navbarLinks">
<ul class="nav navbar-nav">
<li>@Html.ActionLink("New Clients", "NewClients", "Client")</li>
<li>@Html.ActionLink("Build a Custom Test", "Index", "CustomSolutions")</li>
@*More links here...*@
</ul>
</div>
</div>
</nav>
這個問題是我之前發生遷移這一點到自己的文件，所以我不相信這是奇怪行爲的原因。
唯一的其他情況似乎與此類似的情況是解決方案最終導致Bootstrap css和js文件不匹配，我不認爲這種情況，因爲我已經卸載並重新安裝了Bootstrap nuget包（目前使用的是最新版本3.3.7）。
包版本： 引導 - 3.3.7（也嘗試：3.3.5）
的jQuery - 3.1.1（也試過：1.12.4，2.0.0，2.2.4，3.0.0.1）
jQuery.Validation - 1.16.0（也嘗試：1.15.1）
最後的思考：不知道，如果_references.js文件將此事爲此不惜一切，但這裏是該文件，如下：
/// <reference path="jquery-3.1.1.js" />
/// <autosync enabled="true" />
/// <reference path="ajaxcallwithloadingicon.js" />
/// <reference path="bootstrap.min.js" />
/// <reference path="customsolutions/categoryfilterpartial.js" />
/// <reference path="customsolutions/customsolutionspartial.js" />
/// <reference path="customsolutions/index.js" />
/// <reference path="jquery.unobtrusive-ajax.min.js" />
/// <reference path="jquery.validate.min.js" />
/// <reference path="jquery.validate.unobtrusive.js" />
/// <reference path="jquery-3.1.1.min.js" />
/// <reference path="jquery-3.1.1.slim.min.js" />
/// <reference path="modernizr-2.8.3.js" />
/// <reference path="navbarlinkscurrentcolor.js" />
/// <reference path="orderdetailsupdates.js" />
/// <reference path="replacingdivcontents.js" />
/// <reference path="respond.matchmedia.addlistener.min.js" />
/// <reference path="respond.min.js" />
/// <reference path="showhidediv.js" />
/// <reference path="toggledivsandbuttons.js" />