Comment ouvrir un nouvel onglet en arrière-plan sans changer de focus ?

Ouverture d'un nouvel onglet en arrière-plan sans changement de focus

Dans cette question, l'utilisateur cherche à ouvrir un nouvel onglet dans un onglet séparé sans provoquer de déplacement du focus vers le nouvel onglet. Ils démontrent une tentative utilisant les méthodes open() et focus(), mais rencontrent un flash momentané du nouvel onglet avant de revenir à l'onglet actuel dans Chrome.

Cependant, la réponse fournie présente une solution alternative utilisant l'événement simulation pour contourner ce problème.

Répartition d'événements personnalisés

La clé pour obtenir ce comportement réside dans la création dynamique d'un élément et en attribuant son attribut href à l'URL souhaitée. Par la suite, un événement (dans ce cas, un clic de souris) est créé et initialisé avec des paramètres spécifiques, dont le modificateur de touche "ctrl". Cela émule l'action consistant à maintenir la touche "ctrl" enfoncée tout en cliquant sur un lien, ce qui est le comportement par défaut pour ouvrir un nouvel onglet en arrière-plan.

Implémentation

Le code fourni illustre cela technique :

function openNewBackgroundTab(){
    var a = document.createElement("a");
    a.href = "http://www.google.com/";
    var evt = document.createEvent("MouseEvents");
    //the tenth parameter of initMouseEvent sets ctrl key
    evt.initMouseEvent("click", true, true, window, 0, 0, 0, 0, 0,
                                true, false, false, false, 0, null);
    a.dispatchEvent(evt);
}

Conclusion

En tirant parti de la simulation d'événements, cette solution ouvre efficacement un nouvel onglet en arrière-plan sans affecter le focus de l'onglet actuel. Cette technique est particulièrement utile pour les extensions de navigateur ou les bookmarklets où il est crucial de maintenir le focus sur l'onglet actuel pour une expérience utilisateur fluide.

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!