2011-11-11 3 views
3

Je suis en train de naviguer vers une page .html différent en utilisantévénements page pas de tir jquery mobile lors de la navigation sur une page html différente

$.mobile.changePage("PlayGame.html", { transition: "slideup"}, true, true) 

PlayGame.html est à la transition, cependant, aucun des éléments suivants sont tir:

$(document).bind("mobileinit", function() 
{ 
alert(1); 
}); 

$('#gamePage').live('pageinit',function(event, ui) 
{ 
    alert('pageinit'); 
}); 

$('#gamePage').live('pagebeforeshow',function(event, ui) 
{ 
    alert('booooo'); 
}); 

Cependant, si je window.location.href = "PlayGame.html" puis tout feu en conséquence.

Qu'est-ce qui me manque?

Merci

Tom

Répondre

20

Si le code dans votre exemple est dans le <head> du document PlayGame.html alors il ne sera pas inclus lorsque le cadre mobile jQuery saisit la page via AJAX. C'est pourquoi votre code personnalisé s'exécute lorsque vous chargez toute la page, mais pas lorsque vous cliquez sur un lien d'une autre page. Vous voudrez soit mettre votre JavaScript personnalisé dans un seul fichier et l'inclure sur chaque page (il sera donc disponible quelle que soit la page à partir de laquelle l'utilisateur entre votre site) ou vous voulez déplacer le JavaScript personnalisé pour chaque page dans l'élément <div data-role="page"> pour chaque page (il sera donc inclus lorsque la page sera tirée dans le DOM). La raison est que lorsque vous cliquez sur un lien vers un fichier externe, jQuery Mobile utilise AJAX pour extraire la première instance d'un élément <div data-role="page"> et place cet élément dans le DOM actuel, tout le reste du document est ignoré.

Voici quelques suggestions de lecture sur la façon dont fonctionne la navigation jQuery Mobile: http://jquerymobile.com/demos/1.0rc2/docs/pages/page-navmodel.html

+1

Congrats et Bienvenue au Club @Jasper http://stackoverflow.com/badges/1115/jquery-mobile –

+0

Cela a été très utile! Merci :) – matsr

Questions connexes