Comment puis-je cibler des onglets d'amorçage spécifiques à l'aide de liens externes et conserver la sélection lors du rechargement ?

Ciblage d'onglets Bootstrap spécifiques avec des liens externes

Requête :

Comment puis-je accéder à un onglet Bootstrap spécifique en cliquant sur sur un lien externe, garantissant que l'onglet souhaité reste actif sur la page recharger ?

Réponse :

Pour obtenir cette fonctionnalité, implémentez le code JavaScript suivant :

// 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;
})

Explication :

1. Localisation du hachage : Récupérer le hachage (partie suivant le "#") à partir de l'URL actuelle.
2. Activation de l'onglet : Recherchez un lien d'onglet qui correspond au hachage et activez-le pour l'afficher.
3. Préserver le hachage au rechargement : Mettre à jour le hachage de l'URL lorsqu'un onglet est affiché pour conserver son statut actif sur la page recharger.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!