Utiliser onload sur une div

[Anard]

Bonjour,

Je cherche à executer une action après chargement complet d'une div, comme ça se fait pour la balise body.
Je m'explique : sur un site en développement, je propose une galerie photos. Il faut cliquer sur un album pour charger les miniatures des photos qu'il contient par AJAX (par sécurité, un lien direct charge la page complète finale au cas où Javascript serait désactivé).

Au départ, Javascript affiche une icône "chargement" et les miniatures sont grisées. Quand il reçoit la réponse de PHP, les photos réapparaissent normalement et l'icône "chargement" disparait. Mais, en tout cas chez moi avec une connexion digne des années 90, les photos n'apparaissent pas encore, elles restent à charger.
Dans l'idéal, j'aurais aimé que ceci n'intervienne qu'une fois que les photos contenues dans la div sont entièrement chargées.
Malheureusement, l'évènement onload n'est applicable qu'au body ou aux éléments externes (img, iframes, script, style, etc).
J'ai pensé appliquer le script onload sur la dernière image du lot, mais ce n'est pas forcément celle qui sera finie de charger en dernier.

Connaîtriez-vous un moyen de parvenir à mes fins ?

Merci beaucoup pour votre aide.

Ce message a été modifié par Anard - 9 Mar 2019, 16:20.

[No6]

Je n'aime pas trop jQuery (enfin surtout je ne connais pas du tout, et j'ai déjà bien du mal à ne pas me perdre entre tous ces "interlocuteurs" imbriqués les uns dans les autres (HTML, CSS, PHP et JS). Dur de garder la tête bien rangée (ça doit d'ailleurs se voir dans mon code wink.gif )
Après, de ce que j'ai compris, jQuery n'est qu'une extension de Javascript. La même chose doit pouvoir être obtenue en JS pur (à moi de chercher wink.gif )

la fonction nouvelle, et équivalente en JavaScript c'est le Fetch => https://developer.mozilla.org/fr/docs/Web/A...API/Using_Fetch

qui même si elle est indiquée comme expérimentale est maintenant utilisable sur tous les navigateurs => https://caniuse.com/#search=fetch

pour s'asurrer d'une compatibilité absolue il faut ajouter le PolyFill indiqué sur la page MDN.

---

Pour que tu comprenne mieux ton probleme : les commandes Ajax sont asynchrone.
ce qui signifie; pour ce type de fonctions, qu'entre le moment ou elle sont lancées et le moment ou elles ont une réponse (qui généralement prend du temps) l'interpréteur JS n'attend pas les bras croisés que la fonction en ai terminé avant de passer à autre chose, s'il y a du code à faire par la suite, alors il le traite tout de suite et c'est un process à part qui se chargera de faire le traitement demandé lorsque que la réponse arrivera.

Pour gérer les questions de synchronisation autour de différents appels asynchrones, il faut utiliser les mécanismes des promesses, ce que jQuery ne fait pas , car il procède par callBack, qui reste limité (comme le fait le Fetch à la base, mais avec un chainage).
https://developer.mozilla.org/fr/docs/Web/J...r_les_promesses

Ce message a été modifié par No6 - 10 Mar 2019, 23:49.