Question

我将Visual Studio 2017与内置的MVC模板一起使用，我将其添加到bootstrap.css中以创建一个导航栏，该导航栏位于sm / md / lg屏幕的左侧，位于xs屏幕的顶部。导航栏看起来像这样

<div id="sidenav" class="col-xs-12 col-sm-3 col-lg-2 navbar navbar-default navbar-fixed-left nav-stacked">
<div class="col-xs-12 container">
    <!--Header-->
    <div class="navbar-header">
        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
        </button>
        @Html.ActionLink("Menu", "Index", "Home", "Home", new { @class = "navbar-brand" })
    </div>
    <!--Content-->
    <div class="navbar-collapse">
        <ul class="nav navbar-nav">
            <li class="active"><a href="#">Home</a></li>
            <li><a href="@Url.Action("Elements", "Home", "Home")">Elements</a></li>
        </ul>
    </div>
</div>

我在bootstrap.js中添加了以下内容，但未做其他更改：

$('.navbar-nav li a').click(function (e) {
$('.navbar-nav li.active').removeClass('active');
var $this = $(this);
if (!$this.hasClass('active')) {
    $this.addClass('active');
}
e.preventDefault();
});

问题似乎出在e.preventDefault（）上，如果我包含它，则活动列表项将发生变化，但不会发生导航。如果我将其删除，则活动项目将被清除，单击的项目将更改颜色，会发生导航，但是正确的链接将恢复为正常，原始的活动链接将再次处于活动状态。

可能有些小而愚蠢的东西，但是我有什么错或想念的是什么，谢谢。

Bootstrap Navbar活动链接

0 个答案: