Olá pessoal, por favor alguém pode me ajudar...
Tenho o código abaixo e preciso carregar página externa dentro de uma page, para depois acessá-la utilizando #page1.
Já testei com Iframe e funcionou, mas não posso usar iframe nesse projeto.
Grato pessoal
Giovani
-------------------------------------
<body>
<div id="page0" data-role="page">
<header data-role="header" data-position="fixed">
<h1>HOME</h1>
<div class="ui-btn-left">
<a href="#page1" data-role="button" data-icon="arrow-l" data-iconpos="left">Produtos</a>
</div>
<div class="ui-btn-right">
<a href="#page2" data-role="button">Serviços</a>
</div>
</header>
<div data-role="content" class="content">
// texto da home
</div>
</div>
<div id="page1" data-role="page">
<header data-role="header" data-position="fixed">
<h1>Produtos</h1>
<div class="ui-btn-left">
<a href="#page0" data-role="button" data-icon="arrow-l" data-iconpos="left">Home</a>
</div>
</header>
<div data-role="content" class="content">
// NÃO SEI COMO FAZER ISSO
// Quando acesso o site gostaría que aqui já fosse pré carregada uma página produto.php
// apenas uma vez. Depois utilizando #page1 podería acessá-la, mas sem carregá-la novamente,
// apenas mostrar o que já foi carregado no início
</div>
</div>
<div id="page2" data-role="page">
<header data-role="header" data-position="fixed">
<h1>Serviços</h1>
<div class="ui-btn-left">
<a href="#page0" data-role="button" data-icon="arrow-l" data-iconpos="left">Home</a>
</div>
</header>
<div data-role="content" class="content">
// NÃO SEI COMO FAZER ISSO
// Gostaría que aqui fosse pré carregado uma página serviço.php
</div>
</div>
</body>