jQuery Mobile : quand utiliser `pageinit` par rapport à `$(document).ready()` ?

jQuery Mobile : événements de page par rapport à Document Ready

Différences et utilisation

Alors que $(document).ready() est traditionnellement utilisé pour le DOM manipulation d'éléments, il peut ne pas convenir aux applications jQuery Mobile en raison de son chargement de page basé sur Ajax. Cela peut conduire à l'exécution de code avant que les pages ne soient complètement chargées.

Dans jQuery Mobile, les événements de page offrent un meilleur contrôle sur l'exécution des pages. $(document).on('pageinit') est déclenché lorsqu'une page est chargée pour la première fois dans le DOM et constitue un endroit idéal pour initialiser les fonctionnalités spécifiques à la page.

Avantages de l'utilisation des événements de page

• Évitez l'exécution de code avant le chargement des pages.
• Exécutez le code spécifique à une page particulière.
• Contrôle l'ordre d'exécution des événements lors des transitions de page.

Ordre des événements de page pendant les transitions

Lors de la transition entre les pages, les événements sont déclenchés dans l'ordre suivant :

1. pageavantcréer (page B)
2. pagecréer (page B)
3. pageinit (page B)
4. pagebeforehide (page A)
5. pageremove (page A)
6. pagehide (page A)
7. pagebeforeshow (page B)
8. pageshow (page B)

Manipulation des données entre Pages

Les paramètres peuvent être transmis d'une page à une autre à l'aide des options dataUrl et data dans $.mobile.changePage. Ces paramètres peuvent être récupérés en utilisant $(this).data("url") ou $(this).data("data") dans l'événement pagebeforeshow de la page cible.

Conclusion

Page les événements offrent un contrôle plus précis sur l'exécution du code dans les applications jQuery Mobile. En tirant parti de ces événements, les développeurs peuvent éviter les pièges courants et garantir une exécution cohérente sur toutes les pages.

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!