Bootstrap 导航栏响应式下拉菜单不响应触摸

Posted

技术标签:

【中文标题】Bootstrap 导航栏响应式下拉菜单不响应触摸【英文标题】:Bootstrap navbar responsive dropdown doesn't respond to touch 【发布时间】:2013-08-21 07:54:26 【问题描述】:

我正在使用 Twitter Bootstrap 2.3.2 构建响应式网站。我有一个带有下拉菜单的导航栏:

<div class="nav-collapse collapse">
    <ul class="nav">
        <li  % if request.get_full_path = "/" % class="active" % endif % ><a href="/">Home</a></li>

        <li id="fat-menu" class="dropdown" id="about"
        % if request.get_full_path = "/about/" % class="active" % endif %>
        <a href="/about/" role="button" class="dropdown-toggle" data-toggle="dropdown">About
            <b class="caret"></b>
        </a>
        <ul class="dropdown-menu" role="menu" aria-labelledby="about">
            <li role="presentation" class="divider"></li>
            <li role="presentation">
                <a role="menuitem" tabindex="-1" href="/news/"></a>
            </li>
        </ul>
    </li>
</ul>
</div>

在桌面浏览器上,下拉菜单会响应点击,即使窗口已调整大小以显示移动视图。当我通过 Chrome 和 Dolphin 浏览器使用 Nexus 4 时,下拉链接不起作用。插入符号按钮有效,当我单击下拉链接时,下拉菜单缩回并且我没有被重定向。但是,我还没有尝试过其他移动设备。

这是一个已知问题吗?

【问题讨论】:

【参考方案1】:

这似乎是已知问题。但是它显示在 github 上已关闭。我遇到了同样的问题并找到了解决方案Here。

这解决了我的问题。你也可以试试。

【讨论】:

以上是关于Bootstrap 导航栏响应式下拉菜单不响应触摸的主要内容,如果未能解决你的问题,请参考以下文章

Angular UI Bootstrap 响应式导航栏下拉菜单在新版本中无法正常工作

在 Bootstrap 中禁用响应式(移动)导航栏

Bootstrap 4 响应式导航栏垂直

导航栏下拉菜单(折叠)在 Bootstrap 5 中不起作用

使用 Javascript 切换的导航栏汉堡的响应式下拉菜单适用于 Chrome、Firefox,但不适用于 Safari

Bootstrap 4 使用切换按钮连接侧面菜单(响应式)