Question

这让我疯了。我使用Bootstrap模板（在Laravel中），导航栏中有一些菜单项链接到其他页面，一些菜单项链接到同一页面下的目标。

出于某种原因，页面外的链接被禁用＆＃34;即，点击它们什么都不做（没有错误，没有断开的链接，没有）。在页面内容中使用相同的href工作得很好，所以链接/路由很好。当菜单项被鼠标悬停时，页面状态栏显示正确形成的链接，但它仍然没有响应。

我找不到任何阻止它们的东西。我已经尝试了几个类似的帖子建议，例如删除所有类cnavbar-collapse的引用，都无济于事。

非常欢迎任何反馈或建议。＆＃34;仪表板＆＃34;菜单项应该链接到谷歌，但它什么都不做。唯一可行的链接是＆＃34;＃＆＃34;锚 - 他们工作。这是代码：

<!DOCTYPE html>
<html lang="en">
    <head>
        <!-- 
        Boxer Template
        http://www.templatemo.com/tm-446-boxer
        -->
        <meta charset="utf-8">
        <title>MyNewSite</title>
        <meta http-equiv="X-UA-Compatible" content="IE=Edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <meta name="keywords" content="">
        <meta name="description" content="">

        <!-- animate css -->
        <link rel="stylesheet" href="css/animate.min.css">
        <!-- bootstrap css -->
        <link rel="stylesheet" href="css/bootstrap.min.css">
        <!-- font-awesome -->
        <link rel="stylesheet" href="css/font-awesome.min.css">
        <!-- google font -->
        <link href='http://fonts.googleapis.com/css?family=Open+Sans:400,300,400italic,700,800' rel='stylesheet' type='text/css'>

        <!-- custom css -->
        <link rel="stylesheet" href="css/templatemo-style.css">

    </head>
    <body>
        <!-- start preloader -->
        <div class="preloader">
            <div class="sk-spinner sk-spinner-rotating-plane"></div>
         </div>
        <!-- end preloader -->
        <!-- start navigation -->
        <nav class="navbar navbar-default navbar-fixed-top templatemo-nav" role="navigation">
            <div class="container">
                <div class="navbar-header">
                    <button class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                        <span class="icon icon-bar"></span>
                        <span class="icon icon-bar"></span>
                        <span class="icon icon-bar"></span>
                    </button>
                    <a href="#" class="navbar-brand">Divorce|Split</a>
                </div>
                <div class="collapse navbar-collapse">
                    <ul class="nav navbar-nav navbar-right text-uppercase">
                                        <!-- ADDED BY ME  -->
                    @if (Route::has('login'))
                    <!-- <div class="top-right links">  -->
                        @auth
                            <li><a href="#home">Home</a></li>
                        @else
                            <li><a href="{{ route('login') }}">Login</a></li>
                            <li><a href="{{ route('register') }}">Register</a></li>
                        @endauth
                    <!-- </div> -->
                    @endif  
                        <li><a href="#feature">Features</a></li>
                        <li><a href="#pricing">Pricing</a></li>
                        <li><a href="#download">Get Started</a></li>
                        <li><a href="#contact">Contact</a></li>
                        <li>
                            <a href="http://www.google.com">Dashboard</a>
                        </li>
                        <li><a href="{{ url('/logout') }}"> Logout </a></li>
                    </ul>

                </div>
            </div>
        </nav>
        <!-- end navigation -->

Answer 1

我在这里写的是因为我没有足够的声誉来评论。

您的代码对我有用..

必须有一些东西打破这个行动..

请检查css或jquery是否通过任何插件或外部css外部禁用它

Answer 2

经过对上述代码的大量冗长剖析后，我发现templatemo-nav标记中的<nav>类引用是罪魁祸首。

我从所有标签中删除了所有css类引用，并且链接工作正常。然后我将它们从中心嵌套标签一次一个地向外放回去，直到它再次破裂，然后通过消除过程找到了违规的类参考。不知道它做了什么，但没有它，页面看起来和功能都很好，HREF链接现在按预期工作。

感谢Pravin指出我正确的方向。

Bootstrap导航栏离页（非锚点）链接不起作用，但文本中的href很好

2 个答案: