下拉菜单始终处于活动状态并显示

Question

我在使用 Bootstrap (Bootswatch) 下拉菜单时遇到问题，我以前一直在使用它，但不确定我在哪里以及缺少什么，下拉菜单保持打开和活动状态。这是我正在帮助朋友构建 MVC 基本 CRUD 操作的代码。 非常感谢您的帮助，如果您需要任何其他详细信息或代码来帮助我，请告诉我。

家

<div class="collapse navbar-collapse" id="navbarColor01">
    <ul class="navbar-nav mr-auto">

        <li class="nav-item dropdown show">
            <a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="true">لیستی خوێندکاران</a>
            <div class="dropdown-menu show" x-placement="bottom-start" style="position: absolute; transform: translate3d(0px, 40px, 0px); top: 0px; left: 0px; will-change: transform;">
                <div class="dropdown-divider"></div>
                <a class="dropdown-item" href="#">خوێندکاری نوێ</a>
                <div class="dropdown-divider"></div>
                <a class="dropdown-item" href="#">لیستی خوێندکاران</a>
                <div class="dropdown-divider"></div>
            </div>
            </li>

        <li class="nav-item dropdown show">
            <a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="true">لیستی  مامۆستایان</a>
            <div class="dropdown-menu show" x-placement="bottom-start" style="position: absolute; transform: translate3d(0px, 40px, 0px); top: 0px; left: 0px; will-change: transform;">
                <div class="dropdown-divider"></div>
                <a class="dropdown-item" href="#">مامۆستای نوێ</a>
                <div class="dropdown-divider"></div>
                <a class="dropdown-item" href="#">لیستی مامۆستایان</a>
                <div class="dropdown-divider"></div>
            </div>
        </li>

        <li class="nav-item dropdown show">
            <a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="true">لیستی  بەشەکان</a>
            <div class="dropdown-menu show" x-placement="bottom-start" style="position: absolute; transform: translate3d(0px, 40px, 0px); top: 0px; left: 0px; will-change: transform;">
                <div class="dropdown-divider"></div>
                <a class="dropdown-item" href="#">بەشی  نوێ</a>
                <div class="dropdown-divider"></div>
                <a class="dropdown-item" href="#">لیستی بەشەکان</a>
                <div class="dropdown-divider"></div>
            </div>

    </ul>
</div>
<div>


    <form class="form-inline my-2 my-lg-0">
        @Html.Partial("/Views/Shared/_LoginPartial.cshtml")


        @*<input class="form-control mr-sm-2" placeholder="گەڕان" type="text">*@
        @*<button class="btn btn-secondary my-2 my-sm-0" type="submit">Search</button>*@
    </form>
</div>

这就是它的样子。

Answer 1

也许你可以在chrome开发者窗口中查看控制台日志，看看是否显示帮助完整的错误信息。

Answer 2

只需从所有具有dropdown-menu 类的 div 中删除 show 类。即<div class="dropdown-menu show"... 到<div class="dropdown-menu"...

<div class="collapse navbar-collapse" id="navbarColor01">
    <ul class="navbar-nav mr-auto">

        <li class="nav-item dropdown show">
            <a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="true">لیستی خوێندکاران</a>
            <div class="dropdown-menu" x-placement="bottom-start" style="position: absolute; transform: translate3d(0px, 40px, 0px); top: 0px; left: 0px; will-change: transform;">
                <div class="dropdown-divider"></div>
                <a class="dropdown-item" href="#">خوێندکاری نوێ</a>
                <div class="dropdown-divider"></div>
                <a class="dropdown-item" href="#">لیستی خوێندکاران</a>
                <div class="dropdown-divider"></div>
            </div>
        </li>

        <li class="nav-item dropdown show">
            <a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="true">لیستی  مامۆستایان</a>
            <div class="dropdown-menu" x-placement="bottom-start" style="position: absolute; transform: translate3d(0px, 40px, 0px); top: 0px; left: 0px; will-change: transform;">
                <div class="dropdown-divider"></div>
                <a class="dropdown-item" href="#">مامۆستای نوێ</a>
                <div class="dropdown-divider"></div>
                <a class="dropdown-item" href="#">لیستی مامۆستایان</a>
                <div class="dropdown-divider"></div>
            </div>
        </li>

        <li class="nav-item dropdown show">
            <a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="true">لیستی  بەشەکان</a>
            <div class="dropdown-menu" x-placement="bottom-start" style="position: absolute; transform: translate3d(0px, 40px, 0px); top: 0px; left: 0px; will-change: transform;">
                <div class="dropdown-divider"></div>
                <a class="dropdown-item" href="#">بەشی  نوێ</a>
                <div class="dropdown-divider"></div>
                <a class="dropdown-item" href="#">لیستی بەشەکان</a>
                <div class="dropdown-divider"></div>
            </div>

        </ul>
    </div>
<div>

Answer 3

通过运行 update-package 我遇到了包版本不兼容的问题，我能够让它工作。感谢您的帮助和您与我一起调查问题的时间。