Maison > interface Web > js tutoriel > le corps du texte

Pourquoi les scripts de page mobile jQuery doivent-ils être inclus dans « index.html » ?

Patricia Arquette
Libérer: 2024-11-11 02:24:02
original
520 Les gens l'ont consulté

Why Do jQuery Mobile Page Scripts Need to Be Included in `index.html`?

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>
Copier après la connexion

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>
Copier après la connexion

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!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal