jquery mobile charger la page et obtenir des données

Question

Je reçois des problèmes lors de l'appel de la page en utilisant jquery mobile. Dans cet exemple, je suppose que la page d'index (index.html) appellera la page de données (data.html) qui contiendra les données de mon serveur. Sur mon cas, quand je fais la page d'appel de index.html en utilisant la syntaxe:

$.mobile.changePage("data.html"); 

Et à la page data.html J'ai fait ce SINTAX:

$(document).on('pageinit', '#myDataPage', function(){  
    GetData(); 
}); 

function GetData(){ 
    //Ajax Function here 
} 

Après que j'appelle data.html apparemment, aucune donnée n'est affichée. Mais si je le fais, actualisez manuellement la page pour que les données de mon serveur soient affichées avec succès. Y at-il un problème avec mon code?

Answer 1

Par défaut, jQuery Mobile utilise Ajax pour effectuer des transitions de pages. Cela signifie que pendant la transition, jQuery Mobile injectera uniquement le contenu de l'élément body de la réponse (ou plus précisément l'élément data-role = "page", s'il est fourni), ce qui signifie que rien dans la tête de la page ne sera utilisé. l'exception du titre de la page, qui est récupérée spécifiquement). Donc, tous les scripts et les styles référencés dans la tête d'une page n'auront aucun effet quand une page est chargée via Ajax, mais ils seront exécutés si la page est demandée normalement via HTTP.

Si vous déplacez votre script de la balise head à l'intérieur du div de la deuxième page (<div data-role="page" id="myDataPage">), il sera exécuté. Une autre façon est de créer un fichier JS et charger votre JavaScript sur le chargement de la première page (exemple pertinent here).

J'espère que cela aide.