Vous avez trouvé ce tutoriel intéressant ? Recommandez le en cliquant sur le bouton +1    

Définir le titre d'une page et utilisation de data-title

Tutoriel publié le et mis à jour le
Tutoriel en Français

Titres et navigation Ajax

Lorsque vous chargez la première page d'un site basé sur jQuery mobile, puis cliquez sur un lien ou soumettez un formulaire, Ajax est utilisé pour extraire le contenu de la page demandée. Avoir les deux pages dans le DOM est essentiel pour permettre une transition animée entre les pages, mais l'un des inconvénients de cette approche est que le titre de la page est toujours celui de la première page, et non celui de la page suivante que vous consultez.

Pour remédier à cela, jQuery mobile analyse automatiquement le titre title de la page affichée via Ajax et change l'attribut title du document parent pour qu'il corresponde.

Titres dans les modèles multi-pages

Dans un document multi-pages, nous suivons une convention similaire, mais puisque toutes les pages ont un titre title en commun, nous avons un attribut data-title qui peut-être ajouté à chaque conteneur de 'page' au sein d'un modèle multi-page afin de définir un titre manuellement. Le titre du document HTML sera automatiquement mis à jour pour correspondre au titre contenu dans l'attribut data-title de la 'page' actuellement affichée.

<div data-role="page" id="foo" data-title="Page Foo">

</div><!-- /page -->