Charger la page vers un div jQuery Mobile

Question

Je veux charger le contenu d'une page qui est dans un autre dossier (par exemple: "files/pages/example.html") pour le conteneur div en cliquant sur le bouton dans jQuery Mobile!

Comment le faire?

<div data-role="page"> 
    <div id="container" data-role="content"><button id="clickButton">Click me!</button></div> 
</div> 

Answer 1

Le $ .mobile.loadPage est la méthode dont vous avez besoin. Il vous permet de charger un fichier html externe et de l'insérer dans le dom. La valeur par défaut pour cette méthode est de la charger comme une page entière, vous devez donc spécifier les options pour le charger dans un élément dom. Ceci est un exemple (et untested) code:

$('#clickButton').on("click",function(){ 
    $.mobile.loadPage("theURLofThePage",{pageContainer: $('#container')}) 
}); 

maintenant, n'oubliez pas le problème de sécurité crossDomain. J'ai réussi à faire ce travail dans Firefox en ajoutant:

$("#landingPage").live('pageinit', function() { 
      jQuery.support.cors = true; 
      $.mobile.allowCrossDomainPages=true; 
     }); 

En outre, la page que vous chargez doivent être emballées dans un data-role = Page div (disons qu'il a id = 'secondePage'). Après la charge, déclenchement sur la data-role = Page avec id = secondePage div:

$('#secondPage").trigger('pagecreate');