Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Aender

[Resolvido] Carregar página em Div Com jquery

Por , em Javascript

Recommended Posts

Aender    3

Aender
Postado

Olá pessoal tudo bem ? estou desenvolvendo um layout simples onde os links serão abertos dentro de um div especfífico usando jquery .Consegui montar corretamente com a ajuda de um membro aqui do forum, mas me falta um detalhe que parece simples mas que não estou conseguindo resolver pois sou iniciando em js. O layout e composto por um Div topo ,um div menu e um Div paginas onde as páginas serão abertas. Minha dúvida é a seguinte como atualizar simultaneamente os dois Divs topo e paginas, quando clicar em um Link especifico ? Exemplo, se eu clicar no link Home do menu o topo será modificado indicando que o usuário está na página Home, simultaneamnete a da Div pagina tabém será atualizada com o contéudo da página Home.

 

index.php

<html>
<head>
<script type='text/javascript' src='http://code.jquery.com/jquery-1.5.1.min.js'></script>
<script type='text/javascript'>
$(document).ready(function(){
// Executa o evento CLICK em todos os links do menu
$('#menu a').live('click',function(){
 // Faz o carregamento da página de acordo com o COD da página, que vai pegar os valores da página page.php.
 $('#conteudo').load($(this).attr('href'));
 return false;

});

});
</script>
<style type="text/css">
#divtotal
{
width:966px;
height: auto;
background-color:#36C;
}

#conteudo
{   width:800px;
background-color:#0FF;
float:right;
}
#topo
{
width:966px;
height:60px;
background-color:#6FC;
}
#menu
{
width:160px;
height:300px;
background-color:#999;
float:left;
}

</style>
</head>
<body>
<div id="divtotal">
   <div id="topo" >Home</div>
   <div id='menu'>
   <ul>
    <li><a href='page.php?cod=1'>Home</a></li>
    <li><a href='page.php?cod=2'>Serviços</a></li>
   </ul>
   </div>
   <div id='conteudo'>
</div>    
<!-- Aqui serão mostrados os conteúdos -->


</div>
</body>
</html>

 

Page.php



<?php
// Aqui ele pega o valor da varíavel do navegador.
$cod = $_GET['cod'];
// A condição switch faz com que o valor dos códigos do primeiro script represente uma página html que carregará na div conteudo.
switch($cod){
case '1'; // Aqui por exemplo, lá é page.php?cod=1, certo? Então ela vai carregar a página home.html na div conteúdo.
include('home.php');
break;
case '2'; // Aqui tambem, lá é page.php?cod=2, então ela carregará a página de noticias.html.
include('noticias.html');
}

?>

 

Crédito : http://forum.imasters.com.br/user/134998-dii/

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

veja:

http://wbruno.com.br/blog/2011/12/29/carregando-sem-refresh-varias-areas-diferentes-de-um-site-jquery-ajax/

Compartilhar este post

Link para o post
Compartilhar em outros sites

Aender    3

Aender
Postado

 

Olá bruno beleza?

Rapaz que massa, mal postei o topico e já obtive resposta.Bom, o código do Link que você passou é um pouco diferente do meu mas já deu para sacar que é exatamente o que estou querendo , atualizar duas divs simultaneamente ao clicar em um único link.Vou estudar o código aqui.Valeu cara , muito obrigado pela dica.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Dii    15

Dii
Postado

Olá.

 

Recebi a sua PM. :grin:

 

Eu faria o seguinte, não sei se o seu conhecimento é tão avançado. Mas segue a lógica:

 

- Ao clicar no link, enviaria um código qualquer para o PHP e retornar um jSON. Nesse jSON, você retornava a URL que será carregada. E dava um double .load() nessas páginas em duas divs distintas.

 

Se quiser, eu faço um código explicando melhor, caso não entenda.

 

Obrigado por usar meu código :grin:

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado
E dava um double .load() nessas páginas em duas divs distintas.

Oi @Dii, isso é ruim.

 

Veja o post do blog que linkei aqui. Resolve de uma forma melhor.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Dii    15

Dii
Postado

Sim, eu já tinha lido do seu Blog William.

 

É que o amigo me mandou uma PM dizendo que não tinha entendido como ele iria proceder para chegar a tal conclusão.

Compartilhar este post

Link para o post
Compartilhar em outros sites

rdpacato    2

rdpacato
Postado

Pessoal, comigo não funcionou... só queria carregar dentro da div na mesma tela para não ter que ficar dando refresh, usei alguns tutoriais do Bruno, mas não consegui.. tenho um tópico sobre isso se puderem me ajudar eu agradeço, pois preciso muito... valeu:



http://forum.imasters.com.br/topic/524876-esconder-um-frame-ao-clicar-em-um-botao/


Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito