active tab with external link bootstrap 3
<p>first sorry for my poor English .
I have the following code Bootstrap 3 and does not work correctly. If you try to change then navigate tabs sometimes stop working certain tabs.
I need help to correct the error.
The code should work this way , you have a navigation menu and also must be able to activate the tabs of the same external links from the menu.
As having a tabbed menu and a submenu have the same tabs.
From already thank you very much!!!</p>

<pre><code>    &lt;nav id="menu" class="col-sm-9" role="navigation"&gt;
  &lt;ul class="nav nav-tabs"&gt;
    &lt;li class="active"&gt;&lt;a href="#tab1" data-toggle="tab"&gt;HOTEL&lt;/a&gt;&lt;/li&gt;
    &lt;li class="dropdown"&gt;
      &lt;a href="#" class="dropdown-toggle" data-toggle="dropdown"&gt;SERVICIOS &lt;span class="caret"&gt;&lt;/span&gt;&lt;/a&gt;
      &lt;ul class="dropdown-menu" role="menu"&gt;
        &lt;li&gt;&lt;a href="#tab2" data-toggle="tab"&gt;BAR&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#tab3" data-toggle="tab"&gt;DESAYUNO&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#tab4" data-toggle="tab"&gt;/CELÍACO Y &lt;br&gt; DIABÉTICO&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#tab5" data-toggle="tab"&gt;WIFI&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#tab6" data-toggle="tab"&gt;DESCUENTO &lt;br&gt; A VIAJANTE&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#tab7" data-toggle="tab"&gt;SECTOR &lt;br&gt; FUMADORES&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#tab8" data-toggle="tab"&gt;COCHERAS &lt;br&gt; CERRADAS&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#tab9" data-toggle="tab"&gt;PISCINA&lt;/a&gt;&lt;/li&gt;
      &lt;/ul&gt;
    &lt;/li&gt;
    &lt;li class="dropdown"&gt;
      &lt;a href="#" class="dropdown-toggle" data-toggle="dropdown"&gt;HABITACIONES &lt;span class="caret"&gt;&lt;/span&gt;&lt;/a&gt;
      &lt;ul class="dropdown-menu" role="menu"&gt;
        &lt;li&gt;&lt;a href="#tab10" data-toggle="tab"&gt;SINGLE&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#tab11" data-toggle="tab"&gt;CAPACIDADES &lt;br&gt; ESPECIALES&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#tab12" data-toggle="tab"&gt;DOBLES&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="#tab13" data-toggle="tab"&gt;SUIT&lt;/a&gt;&lt;/li&gt;
      &lt;/ul&gt;
    &lt;/li&gt;
    &lt;li&gt;&lt;a href="#tab14" data-toggle="tab"&gt;GALERÍA&lt;/a&gt;&lt;/li&gt;
    &lt;li&gt;&lt;a href="#tab15" data-toggle="tab"&gt;CONTACTO&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
&lt;/nav&gt;
&lt;div class="container"&gt;
  &lt;div class="row"&gt;
    &lt;div class="col-sm-12 tab-content"&gt;

      &lt;!-- *****************     HOTEL     ***************** --&gt;

      &lt;div id="tab1" class="tab-pane fade in active"&gt;
        &lt;p&gt;tab1&lt;/p&gt;
      &lt;/div&gt;

      &lt;!-- *****************     SERVICIOS     ***************** --&gt;

      &lt;div id="tab2" class="tab-pane fade"&gt;
        &lt;p&gt;tab2&lt;/p&gt;
      &lt;/div&gt;

      &lt;div id="tab3" class="tab-pane fade"&gt;
        &lt;p&gt;tab3&lt;/p&gt;
      &lt;/div&gt;

      &lt;div id="tab4" class="tab-pane fade"&gt;
        &lt;p&gt;tab4&lt;/p&gt;
      &lt;/div&gt;

      &lt;div id="tab5" class="tab-pane fade"&gt;
        &lt;p&gt;tab5&lt;/p&gt;
      &lt;/div&gt;

      &lt;div id="tab6" class="tab-pane fade"&gt;
        &lt;p&gt;tab6&lt;/p&gt;
      &lt;/div&gt;

      &lt;div id="tab7" class="tab-pane fade"&gt;
        &lt;p&gt;tab7&lt;/p&gt;
      &lt;/div&gt;

      &lt;div id="tab8" class="tab-pane fade"&gt;
        &lt;p&gt;tab8&lt;/p&gt;
      &lt;/div&gt;

      &lt;div id="tab9" class="tab-pane fade"&gt;
        &lt;p&gt;tab9&lt;/p&gt;
      &lt;/div&gt;

      &lt;!-- *****************     HABITACIONES     ***************** --&gt;

      &lt;div id="tab10" class="tab-pane fade"&gt;
        &lt;p&gt;tab10&lt;/p&gt;
      &lt;/div&gt;

      &lt;div id="tab11" class="tab-pane fade"&gt;
        &lt;p&gt;tab11&lt;/p&gt;
      &lt;/div&gt;

      &lt;div id="tab12" class="tab-pane fade"&gt;
        &lt;p&gt;tab12&lt;/p&gt;
      &lt;/div&gt;

      &lt;div id="tab13" class="tab-pane fade"&gt;
        &lt;p&gt;tab13&lt;/p&gt;
      &lt;/div&gt;

      &lt;!-- *****************     GALERIA     ***************** --&gt;

      &lt;div id="tab14" class="tab-pane fade"&gt;
        &lt;p&gt;tab14&lt;/p&gt;
      &lt;/div&gt;

      &lt;!-- *****************     CONTACTO     ***************** --&gt;

      &lt;div id="tab15" class="tab-pane fade"&gt;
        &lt;p&gt;tab15&lt;/p&gt;
      &lt;/div&gt;

    &lt;/div&gt;
  &lt;/div&gt;
  &lt;!-- end row --&gt;
&lt;/div&gt;
&lt;!-- end container --&gt;
&lt;ul class="line"&gt;
  &lt;li&gt;&lt;a href="#tab2" data-toggle="tab"&gt;BAR&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href="#tab3" data-toggle="tab"&gt;DESAYUNO&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href="#tab4" data-toggle="tab"&gt;/CELÍACO Y DIABÉTICO&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href="#tab5" data-toggle="tab"&gt;WIFI&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;ul&gt;
  &lt;li&gt;&lt;a href="#tab6" data-toggle="tab"&gt;DESCUENTO A VIAJANTE&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href="#tab7" data-toggle="tab"&gt;SECTOR FUMADORES&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href="#tab8" data-toggle="tab"&gt;COCHERA CERRADA&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href="#tab9" data-toggle="tab"&gt;PISCINA&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;ul&gt;
  &lt;li&gt;&lt;a href="#tab10" data-toggle="tab"&gt;SINGLE&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href="#tab11" data-toggle="tab"&gt;CAPACIDADES ESPECIALES&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href="#tab12" data-toggle="tab"&gt;DOBLES&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href="#tab13" data-toggle="tab"&gt;SUIT&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
</code></pre>

<p>JAVASCRIPT:</p>

<pre><code>$('a[data-toggle="tab"]').on('shown.bs.tab', function(e) {
  var target = this.href.split('#');
  $('.nav a').filter('a[href="#' + target[1] + '"]').tab('show');
})
</code></pre>