Bootstrap：切换两个导航栏并更改aria扩展

问题描述

我有一对Bootstrap导航栏，一个主导航栏和一个辅助导航栏。一切看起来都很好。

如果进入折叠视图，则会看到汉堡按钮，然后单击它可以展开菜单，并且在视觉上它的行为完全符合我的期望。同样如预期的那样，aria-expanded属性从false变为true。

但是，当我关闭菜单时，aria-expanded属性仍然为true。其他一切工作都很好，show类可以按需来来去去，菜单可以毫无问题地折叠和展开。

除了Bootstrap JS软件包和jQuery外，我没有JavaScript，因此不应该有任何干扰。以下是我的HTML。我想知道我的切换器按钮是否需要特别放在某个内部或外部。

<div id="navbarWrapper" class="navbar-wrapper fixed-top">
    <div class="container">
        <a class="navbar-brand" href="/">
            <img src="logo.png">
        </a>
        <div class="navs-wrapper">           
        <nav class="navbar navbar-expand-md primary-nav">
            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target=".collapse" aria-controls="collapse" aria-expanded="false" aria-label="Toggle navigation">
                <span class="navbar-toggler-icon"></span>
            </button>
            <div class="collapse navbar-collapse">
                <ul class="navbar-nav">
                    <li class="menu-item"><a href="#" class="nav-link">Link</a></li>
                    <li class="menu-item"><a href="#" class="nav-link">Link</a></li>
                    <li class="menu-item"><a href="#" class="nav-link">Link</a></li>
                </ul>
            </div>
        </nav>
        <nav class="navbar navbar-expand-md secondary-nav">
            <div class="collapse navbar-collapse">
                <ul class="navbar-nav">
                    <li class="menu-item"><a href="#" class="nav-link">Link</a></li>
                    <li class="menu-item"><a href="#" class="nav-link">Link</a></li>
                    <li class="menu-item"><a href="#" class="nav-link">Link</a></li>
                </ul>
            </div>
        </nav>
        </div><!-- .navs-wrapper -->
    </div><!-- .container -->
</div><!-- .navbar-wrapper -->

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）