Wie kann ich mithilfe externer Links auf bestimmte Bootstrap-Registerkarten abzielen und die Auswahl beim erneuten Laden beibehalten?

Targeting auf bestimmte Bootstrap-Registerkarten mit externen Links

Abfrage:

Wie kann ich beim Klicken zu einer bestimmten Bootstrap-Registerkarte navigieren? auf einen externen Link, um sicherzustellen, dass die gewünschte Registerkarte auf der Seite aktiv bleibt neu laden?

Antwort:

Um diese Funktionalität zu erreichen, implementieren Sie den folgenden JavaScript-Code:

// Javascript to enable link to tab
var hash = location.hash.replace(/^#/, '');  // ^ means starting, meaning only match the first hash
if (hash) {
    $('.nav-tabs a[href="#' + hash + '"]').tab('show');
}

// Change hash for page-reload
$('.nav-tabs a').on('shown.bs.tab', function (e) {
    window.location.hash = e.target.hash;
})

Erklärung:

1. Den Hash finden: Rufen Sie den ab Hash (Teil nach dem „#“) aus der aktuellen URL.
2. Aktivieren des Tabs: Suchen Sie nach einem Tab-Link, der dem Hash entspricht, und schalten Sie ihn zur Anzeige um.
3. Hash beim erneuten Laden beibehalten: Aktualisieren Sie den URL-Hash, wenn ein Tab angezeigt wird, um seinen aktiven Status auf der Seite beizubehalten neu laden.

Das obige ist der detaillierte Inhalt vonWie kann ich mithilfe externer Links auf bestimmte Bootstrap-Registerkarten abzielen und die Auswahl beim erneuten Laden beibehalten?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!