Pourquoi les scripts doivent être inclus dans Index.html lors de l'utilisation de jQuery Mobile
Introduction
Dans les projets jQuery Mobile, la redirection des pages à l'aide de $.mobile.changepage() prête à confusion. Les développeurs doivent inclure tous les scripts de page dans le même fichier, index.html, sinon la page de redirection ne parviendra pas à exécuter les fonctions définies dans son en-tête. Cet article explique le comportement derrière ce phénomène.
Comment jQuery Mobile gère les modifications de page
jQuery Mobile utilise Ajax pour charger les pages suivantes. Alors que la première page est chargée normalement, les pages suivantes ne chargent que leur contenu. Plus précisément, seul le premier div avec l'attribut data-role="page" est incorporé dans le DOM, ignorant tout le reste.
Raison de l'inopérabilité du script
Dans votre Sur la deuxième page et les pages suivantes, le bouton est visible car le HTML est rendu normalement. Cependant, l'événement click ne fonctionne pas car son en-tête parent a été ignoré lors de la transition de page.
Solution 1 : déplacer les scripts vers le contenu du corps
Une solution rapide consiste à déplacer la balise script dans le contenu du corps des pages suivantes :
<body> <div data-role="page"> // HTML content <script> // JavaScript </script> </div> </body>
Solution 2 : Consolider les scripts dans Index.html
Une solution privilégiée consiste à déplacer tout le JavaScript dans un seul fichier, index.js, placé en tête du premier fichier HTML :
<head> <meta ...> <link rel="stylesheet" ...> <script src="jquery.mobile-1.2.0.min.js"></script> <script src="index.js"></script> // Your consolidated JavaScript </head>
Raison de la consolidation d'Index.html
Phonegap, comme jQuery Mobile, peut présenter des bugs. Si tout le JavaScript est placé dans un seul fichier HTML, une erreur pourrait survenir et actualiser la page actuelle. Si cette page ne dispose pas du JavaScript requis, elle ne fonctionnera plus jusqu'au redémarrage.
Solution réaliste
Déplacez le fichier index.js dans l'en-tête de tous les autres fichiers HTML. . Cela garantit que les scripts sont accessibles même si d'autres éléments DOM sont perdus en raison de bugs.
Conclusion
Comprendre comment jQuery Mobile gère les modifications de page est crucial pour un développement d'application réussi. La consolidation des scripts dans index.html est une solution recommandée pour garantir la disponibilité des scripts et prévenir les problèmes potentiels avec Phonegap.
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!