Bootstrap-Registerkarte Aktivierung mit JQuery
Ich habe den folgenden code
<ul class="nav nav-tabs">
<li><a href="#aaa" data-toggle="tab">AAA</a></li>
<li><a href="#bbb" data-toggle="tab">BBB</a></li>
<li><a href="#ccc" data-toggle="tab">CCC</a></li>
</ul>
<div class="tab-content" id="tabs">
<div class="tab-pane" id="aaa">...Content...</div>
<div class="tab-pane" id="bbb">...Content...</div>
<div class="tab-pane" id="ccc">...Content...</div>
</div>
Und das folgende Skript
$(document).ready(function(){
activaTab('aaa');
});
function activaTab(tab){
$('.tab-pane a[href="#' + tab + '"]').tab('show');
};
In diesem Fall, wenn die Seite fertig ist die zweite Registerkarte wird aktiviert, aber ich immer bekomme einen JavaScript-Fehler in der Zeile $('.tab-pane a[href="#' + tab + '"]').tab();
Kann mir jemand helfen bitte?
InformationsquelleAutor der Frage user2607411 | 2013-07-24
Du musst angemeldet sein, um einen Kommentar abzugeben.
Anwendung ein Selektor, der aus der
.nav-tabs
scheint zu funktionieren:Sehen diese demo.
Ich würde lieber @codedme Antwort, denn wenn Sie wissen, welche Registerkarte, die Sie möchten, bevor die Seite laden, sollten Sie vielleicht ändern Sie die Seite html-und JS für diese Besondere Aufgabe.
Ich gezwickt die demo für seine Antwort, wie auch.
Werden(wenn dies nicht für Sie arbeiten, bitte geben Sie Ihre Einstellung - browser, Umwelt, etc.)
InformationsquelleAutor der Antwort MasterAM
Führen Sie einen Klick auf den link auf der Registerkarte verankern, wenn die Seite fertig ist, d.h.
Oder in vanilla JavaScript
InformationsquelleAutor der Antwort Kamran Ahmed
Hinzufügen aktive Klasse zu jedem li-element, das Sie wollen, aktiv zu sein nach dem laden der Seite.
Und auch das hinzufügen von aktiven Klasse zu content-div wird gebraucht ,fade-in-Klassen sind nützlich, für einen reibungslosen übergang.
InformationsquelleAutor der Antwort codedme
Dieser ist ziemlich einfach von w3schools: https://www.w3schools.com/bootstrap/bootstrap_ref_js_tab.asp
InformationsquelleAutor der Antwort Amine Boulaajaj
warum nicht wählen Sie die aktive Registerkarte erst dann aktiv, werden die ausgewählten Registerkarte Inhalt ?
1. Fügen Sie der Klasse 'active', um die < li > element der ersten Registerkarte .
2. verwenden Sie dann set 'active' - Klasse zu ausgewählten div.
InformationsquelleAutor der Antwort Kanit P.
Fügen Sie ein id-Attribut auf ein html-tag
Dann mit JQuery
InformationsquelleAutor der Antwort Dmytro Goncharuk