Recomendo carregar a página que vc quer dentro de uma div
<div id='conteudo'>
E um botão para disparar o evento de carga :
<div id='newConteudo'>
Com a ajuda do jquery:
$('#newConteudo').on('click', function(){
$('#conteudo').load('subPag.php')
});
neste caso o arquivo subPag.php
terá a função montar a nova subPágina considerando que o assunto carregado fará parte de uma página principal que não será recarregada.
O arquivo subPag.php
deverá ser tratado como um trecho de página mesmo. Não deverá ter as tags <head>
ou <body>
, é um trecho da sua página original.
Isto tem suas vantagens:
- O CSS da página original afeta a subpágina,
- As funções javascript/jquery a pagina original também podem funcionar na subpágina, contanto que tenha utilizado
.on
.
Não recomendo carregar muito script na subpágina, pois vai carregando a página principal e facilmente pode gerar conflitos.
Existe ainda outra possibilidade com a carga via $.post
. Nesta opção você utiliza de um botão/link para ativar a função, que por sua vez pode enviar alguns dados ou até campos de formulários a um arquivo PHP. este arquivo PHP, por sua vez, processa os dados e retribui via JSON um conjunto de informações. Estas informações podem ser processadas na função de retorno do comando $.post
e direcionadas para uma div ou outro local/elemento da página para alteração da página atual. Isto tudo sem alterar a URL do topo da página.