Twitter Bootstrap-nav nav-tabs " nicht ändern, klicken Sie auf

Mag ich, wie die nav-tabs aussieht, damit ich es verwenden möchten. Dies ist, wie die web-Anwendung sieht jetzt:

Leider, wenn ich auf den anderen Reiter (z.B. "Buscar alojamiento"), die aktive Registerkarte nicht ändern. Das ist mein code:

<ul class="nav nav-tabs">

    <li>        
        <g:link controller="usuario" action="show">         
            <g:message code="nav.usuario.show" default="Datos del usuario" />           
        </g:link>       
    </li>   

    <li class="active">
        <a href="${createLink(uri: '/')}">
            <g:message code="nav.home" default="Página de inicio" />
        </a>
    </li>

    <li>        
        <g:link controller="alojamiento" action="show">         
            <g:message code="nav.alojamiento.show" default="Buscar alojamiento" />          
        </g:link>       
    </li>   

</ul>

Ich versuche auch entfernen class="active". Keine Registerkarte aktiv ist immer zu tun.

Wo ist dein javascript?
Das hat absolut nichts mit Grails.
<g:link... ist Grails @JamesKleeh`
Es ist nicht Javascript hier @AntarrByrd
Ist die Antwort hilfreich und angemessen für die Annahme?

InformationsquelleAutor chelder | 2013-08-15

11

Überprüfen Sie die "Tabbable Nav" Beispiel in der Twitter-Bootstrap-Komponenten. Sie müssen die richtigen html zu dieser Arbeit. Beispiel:
```
<ul class="nav nav-tabs">
  <li class="active">
    <a href="#home" data-toggle="tab">Home</a>
  </li>
  <li><a href="#other" data-toggle="tab">Other</a></li>
  <li><a href="#">...</a></li>
</ul>
 <div class="tab-content">
   <div id="home" class="tab-pane active">
     <p>Home</p>
   </div>
   <div id="other" class="tab-pane">
     <p>Other</p>
   </div>
</div>
```
Sehen die class angewendet und die href des links.

UPDATE

Wie wir besprochen haben, in den Kommentaren, können wir auch ändern mit Javascript:
```
<script type="text/javascript">
    ...
    document.getElementById("home").setAttribute("class","active")
```
Oder JQuery:
```
$('#home').attr('class','active')
```
Sagte Sie. Wir sind pulpiteers des gleichen Evangeliums. Dieses mal haben Sie eine ausführliche Antwort. 😉
Ich bin versucht zu verwenden nav nav-tabs zu handeln, wie navbar-inner. Ich meine, wenn wir klicken auf einen normalen link, es wird nicht angezeigt, eine tab-pane. Es springt dann auf den link geklickt. Wie könnte ich das ändern das Aussehen des navbar-inner um zu sehen, wie die nav nav-tabs?
Sie wollen, gehen Sie zu diesem link, oder einfach nur zeigen der Inhalte, der link in dem tab?
Behandeln class="active" nach der aktuellen Seite...
Sie können auch verwenden die JQuery -> $('#tab1Id').attr('class','active')

InformationsquelleAutor Sérgio Michels
3

Müssten Sie Tabbable Nav zum Umschalten zwischen den Inhalten der einzelnen Register.

Ich legte meinen code zwischen <div class="tabbable">. Nichts hat sich geändert.
Folgen Sie dem Beispiel gezeigt in der bootstrap-Seite oder Folgen Sie, was Sergio gesagt hat, beide das gleiche meinen. @chelder

InformationsquelleAutor dmahapatro

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.