Safari ignore tabindex

Question

J'ai 2 boutons à côté d'une zone de texte et une autre zone de texte après les 2 boutons. Le tabindex pour la première zone de texte est de 1000, le premier bouton est de 1001 et le deuxième bouton est de 1002. La deuxième zone de texte a un tabindex de 1003.

Lorsque j'appuie sur la touche tabulation, le tabindex fonctionne correctement dans tous les navigateurs sauf dans Safari, où il passe immédiatement de la première zone de texte à la deuxième zone de texte bien que le tabindex ait été correctement défini. Des idées sur la manière de résoudre ce problème?

Answer 1

Pour ceux comme moi qui cherchent également comment activer cela dans browserstack : il suffit de cliquer sur le mot "Safari" dans le bouton en haut à gauche de l'écran, puis vous pouvez sélectionner Préférences > Avancé > Appuyez sur la touche Tab (comme mentionné dans https://stackoverflow.com/a/1914496/11339541)

Answer 2

Rencontré le même problème et j'ai dû implémenter la navigation par onglets de façon programatique. Heureusement, j'ai trouvé ce plugin jQuery tabbable https://github.com/marklagendijk/jQuery.tabbable et je l'ai mis à bon usage, voici

require('../../node_modules/jquery.tabbable/jquery.tabbable');
$(document).ready(() => {
  $(document).keydown((event) => {
    if (event.keyCode === 9) {
      window.$.tabNext();
      event.preventDefault();
    }
  });
});

Answer 3

Safari est nul en ce qui concerne les onglets. J'ai essayé plusieurs méthodes, ma solution, dites-leur de ne pas utiliser Safari. Chrome, IE et Firefox sont toutes des solutions acceptables par rapport à Safari, oui IE est meilleur que Safari (pas IE 6, cependant) :-).