为什么所有链接都在带有引导程序的新选项卡中打开?

时间:2016-04-18 19:08:27

标签: javascript jquery css twitter-bootstrap navbar

我在带有导航栏的页面上使用bootstrap。我目前遇到两个我认为相关的问题。

1)所有导航栏链接都会打开一个新标签页 2)可折叠元素,而不是在单击时折叠或展开也会打开一个新选项卡。例如,使用示例代码,单击涉及这段代码的折叠元素:

<a data-toggle="collapse" data-parent="#accordion" href="#collapse1">

实际在http://domain/#collapse1

打开一个新标签页

我认为这两个问题是相关的。

来自我的<head>

<!-- Bootstrap -->
<link href="http://.../include/bootstrap/css/bootstrap.min.css" rel="stylesheet">

<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
  <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
  <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
<script src="http://.../include/bootstrap/bootstrap.js"></script>

但即使我从bootstraps网站加载css和js,我也会得到相同的结果。

导航栏代码示例:

<nav class="navbar navbar-fixed-top navbar-default" role="navigation">
  <div class="navbar-header">
    <ul class="nav navbar-nav">
       <li class="nav-item">
          <a class="nav-link" href="http://.../">home</a>
       </li>
       <li class="nav-item">
          <a class="nav-link" href="http://.../portfolio/">Portfolio</a>
       </li>
       <li class="nav-item active">
          <a class="nav-link" href="http://.../cv/">CV<span class="sr-only">(current)</span></a>
       </li>
       <li class="nav-item">
          <a class="nav-link" href="http://.../contact/">Contact</a>
        </li>
    </ul>
    </div>
   </nav>

然而,所有这些都在新标签中打开。有任何想法吗?

1 个答案:

答案 0 :(得分:0)

我遇到了同样的问题。我通过添加以下内容修复了它:

原文链接:

<a class="nav-link" href="http:...">Home</a>

新链接:

<a class="nav-link" target="_self" href="http:...">Home</a>