Discussion :

[FixSan]

Bonjour,

En haut de la page d'accueil de mon site se trouve un carrousel (nommé "Les dernières nouvelles de la médiathèque") qui dispose de liens "Billet suivant" et "Billet précédent".

Ces liens sont ajoutés dynamiquement via javaScript. J'aimerais que, lorsqu'on navigue au clavier par tabulations, le focus soit donné à ces liens avant de l'être au contenu du carrousel.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
function carousel_editos_initCallback(carousel) {
	$("#editos").focusin(function () { $("#carousel-editos li.jcarousel-item a.comment_count").focus(); });
}

Le code précédent fonctionne. Il donne le focus, lors de la navigation au clavier, au dernier lien du carrousel. C'est juste une sorte de test.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
function carousel_editos_initCallback(carousel) {
	$("#editos").focusin(function () { $("#editos .jcarousel-container .jcarousel-next").focus(); });
}

En revanche, le code précédent ne fonctionne pas : il devrait donner le focus, cette fois, au lien "Billet suivant".

Le problème vient, je pense, du fait que ces liens sont ajoutés dynamiquement, et ne peuvent donc être directement pointés par la syntaxe $("#editos .jcarousel-container .jcarousel-next"). Je devrait peut-être utiliser la fonction .delegate()... mais comment ?

Merci de votre aide !

[FixSan]

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

$('body').on('focusin', '#editos', function(){ //le code });

Et ça fonctionne !