HTML - Bootstrap - 菜单项不点击iPhone

时间:2015-07-04 08:25:08

标签: html twitter-bootstrap menu navbar

正如标题所说我在iPhone上查看时无法点击引导程序导航栏菜单项。

我已经模拟了Chrome,链接工作正常。

有什么想法吗?

 <header id="Home" class="header">
        <div style="text-align:right; color:#ffffff;">For your FREE mediation consultation** call:<br><strong style="font-size:24px;">XXXXXX</strong></div>
            <div class="menu-wrapper">
                <nav id="navigation" class="navbar navbar-default" role="navigation">
                    <div class="navbar-inner">
                        <div class="navbar-header">
                            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navigationbar">
                                <span class="sr-only">Toggle navigation</span>
                                <i class="fa fa-bars fa-2x"></i>
                            </button>
                            <a id="brand" class="navbar-brand" href="index.html" style="color:#ffffff; font-size:24px; line-height:24px;">
                            Company <br>
                            Name<br>
                            Here
                            </a>
                        </div>
                        <div class="navbar-collapse collapse" id="navigationbar">
                            <ul class="nav navbar-nav navbar-right" id="nav">
                                <li class="current"><a href="#Home" title="">Home</a></li>
                                <li><a href="#About_Us" title="">About Us</a></li>
                                <li><a href="#Practice_Area" title="">What is Mediation</a></li>
                                <li><a href="#faq" title="">FAQ</a></li>
                                <li><a href="#expertise" title="">Our Expertise</a></li>
                                <li><a href="#fees" title="">Our Fees</a></li>
                                <li><a href="#contact" title="">Contact</a></li>
                            </ul>
                        </div><!-- end navbar-collapse collapse -->
                    </div><!-- nav -->
                </nav><!-- end navigation -->
            </div><!-- menu wrapper -->
        </header><!-- end header -->

1 个答案:

答案 0 :(得分:0)

好的......我发现罪魁祸首却不知道如何修复

 <script type="text/javascript">
      // Close the navbar if collapsed (small screen) when clicking on a menu link
      // From edit 2 on
      // http://stackoverflow.com/questions/14203279/bootstrap-close-responsive-menu-on-click/23171593#23171593
      $(function () {
        $('.navbar-collapse ul li a:not(.dropdown-toggle)').bind('click touchstart', function () {
          $('.navbar-toggle:visible').click();
        });
      });
    </script>

如果我删除此代码它可以工作,但菜单不会消失。我想要一个解决方案,点击菜单项,菜单就会消失。

谢谢!