Carregar Html dentro de uma DIV
Pessoal,
Sou iniciante em Html, Css, JavaScript, sei pouco mais estou me esforçando para aprender. Eu tenho um menu onde ao clicar carrega o conteúdo que é outro Html dentro da div "conteudo" sem sair da página, tentei desta forma mais ao clicar no menu nada acontece, o que estou fazendo de errado?
Sou iniciante em Html, Css, JavaScript, sei pouco mais estou me esforçando para aprender. Eu tenho um menu onde ao clicar carrega o conteúdo que é outro Html dentro da div "conteudo" sem sair da página, tentei desta forma mais ao clicar no menu nada acontece, o que estou fazendo de errado?
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="https://code.jquery.com/jquery-2.2.3.min.js" integrity="sha256-a23g1Nt4dtEYOj7bR+vTu7+T8VP13humZFBJNIYoEJo=" crossorigin="anonymous"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script type="text/javascript" src="includes/upload/jquery-1.4.2.min.js"></script>
<link rel="stylesheet" type="text/css" href="style/style2.css" /><!--Folha de estilo da página-->
<script type = "text/javascript">
function carregar(pagina){
$("#conteudo").load(pagina);
}
</script>
</head>
<body>
<ul>
<li><a onclick="carregar('Index2.html');" href="#">Principal</a></li>
<li><a onclick="carregar('OSPadrinhos.html');" href="#">Os Padrinhos</a></li>
</ul>
</div>
<div id="conteudo"></div>
</body>
</html>
André Salgueiro
Curtidas 0
Melhor post
Jothaz
06/05/2016
O que acontece é que provavlemente você esta rodando sua página pelo browser direto da pasta e esta feature só pode ser usada quando executado via servidor, pois o .load() é justamente uma forma simples de executar requisições assíncronas vai Ajax.
No post [url:descricao=HTML 5 E GEOLOCALIZAÇÃO]https://www.devmedia.com.br/forum/html-5-e-geolocalizacao/553157 [/url]tem um problema parecido com este, acho que compensa uma lida.
Fiz um vídeo para explicar o problema HTML5 navigator geolocation
Instale um servidor qualquer, IIS (nativo do windows), Tomcat, Apache, jBoss e rode que vai funcionar.
No post [url:descricao=HTML 5 E GEOLOCALIZAÇÃO]https://www.devmedia.com.br/forum/html-5-e-geolocalizacao/553157 [/url]tem um problema parecido com este, acho que compensa uma lida.
Fiz um vídeo para explicar o problema HTML5 navigator geolocation
Instale um servidor qualquer, IIS (nativo do windows), Tomcat, Apache, jBoss e rode que vai funcionar.
GOSTEI 2
Mais Respostas
Marlon Gera
06/05/2016
<script src="https://code.jquery.com/jquery-2.2.3.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script type="text/javascript" src="includes/upload/jquery-1.4.2.min.js"></script>Provavelmente isso :)
GOSTEI 0
William
06/05/2016
Tomei a liberdade de assistir seus 2 vídeos Jothaz, didática excelente, parabéns!
GOSTEI 0
André Salgueiro
06/05/2016
Obrigado Jhotaz, agora fico claro o motivo de não esta funcionando, aproveitei e assisti os dois vídeos, são bem esclarecedores.
Bem, para o meu problema, gostaria de não utilizar o load para não precisar instalar um servidor neste momento, prefiro fazer funcionar localmente, usando outra função que não seja o load, sabe como posso fazer isso?
Bem, para o meu problema, gostaria de não utilizar o load para não precisar instalar um servidor neste momento, prefiro fazer funcionar localmente, usando outra função que não seja o load, sabe como posso fazer isso?
GOSTEI 0
André Salgueiro
06/05/2016
Obrigado Jhotaz, agora fico claro o motivo de não esta funcionando, aproveitei e assisti os dois vídeos, são bem esclarecedores.
Bem, para o meu problema, gostaria de não utilizar o load para não precisar instalar um servidor neste momento, prefiro fazer funcionar localmente, usando outra função que não seja o load, sabe como posso fazer isso?
Obrigado Jhotaz, agora fico claro o motivo de não esta funcionando, aproveitei e assisti os dois vídeos, são bem esclarecedores.
Bem, para o meu problema, gostaria de não utilizar o load para não precisar instalar um servidor neste momento, prefiro fazer funcionar localmente, usando outra função que não seja o load, sabe como posso fazer isso?
Bem, para o meu problema, gostaria de não utilizar o load para não precisar instalar um servidor neste momento, prefiro fazer funcionar localmente, usando outra função que não seja o load, sabe como posso fazer isso?
O que acontece é que provavlemente você esta rodando sua página pelo browser direto da pasta e esta feature só pode ser usada quando executado via servidor, pois o .load() é justamente uma forma simples de executar requisições assíncronas vai Ajax.
No post [url:descricao=HTML 5 E GEOLOCALIZAÇÃO]https://www.devmedia.com.br/forum/html-5-e-geolocalizacao/553157 [/url]tem um problema parecido com este, acho que compensa uma lida.
Fiz um vídeo para explicar o problema HTML5 navigator geolocation
Instale um servidor qualquer, IIS (nativo do windows), Tomcat, Apache, jBoss e rode que vai funcionar.
No post [url:descricao=HTML 5 E GEOLOCALIZAÇÃO]https://www.devmedia.com.br/forum/html-5-e-geolocalizacao/553157 [/url]tem um problema parecido com este, acho que compensa uma lida.
Fiz um vídeo para explicar o problema HTML5 navigator geolocation
Instale um servidor qualquer, IIS (nativo do windows), Tomcat, Apache, jBoss e rode que vai funcionar.
Obrigado Jhotaz, agora fico claro o motivo de não esta funcionando, aproveitei e assisti os dois vídeos, são bem esclarecedores.
Bem, para o meu problema, gostaria de não utilizar o load para não precisar instalar um servidor neste momento, prefiro fazer funcionar localmente, usando outra função que não seja o load, sabe como posso fazer isso?
GOSTEI 0
Jothaz
06/05/2016
William (Devwilliam).
Fico muito feliz pelo elogio, ainda mais vindo de você, uma pessoa que admiro.
Tenho vontade de criar uma série de vídeos para compartilhar o conhecimento, mas não esta me sobrando tempo.
E para fazer isto gostaria de fazer com um conteúdo e organizado o que demanda tempo e dedicação.
André Salgueiro.
Usando somente HTML você não conseguirá fazer o que quer. Para conseguir usar este 'include' vai ser necessário uma linguagem front-end ou um framework tipo AngularJS (ng-inlude), mas mesmo assim não é garantido que rodará em todos os browsers se executado diretamente no browser e não via servidor.
É um péssima prática e uma tremenda gambiarra e não aconselho usar e vou citar aqui somente como aprendizado, mas pode-se usar a tag frameset (descontinuada) ou iFrame.
Mas volto a ressaltar que é um solução horrível, amadora e que vai gerar alguns transtornos, mas funciona.
Aconselho que a principio crie a páginas repetindo as partes comuns, como motrei no meu vídeo ai sim vai funcionar. Sei que é trabalhoso, mas é melhor que usar gambiarras.
A solução mais profissional é usar uma linguagem back-end.
Fico muito feliz pelo elogio, ainda mais vindo de você, uma pessoa que admiro.
Tenho vontade de criar uma série de vídeos para compartilhar o conhecimento, mas não esta me sobrando tempo.
E para fazer isto gostaria de fazer com um conteúdo e organizado o que demanda tempo e dedicação.
André Salgueiro.
Usando somente HTML você não conseguirá fazer o que quer. Para conseguir usar este 'include' vai ser necessário uma linguagem front-end ou um framework tipo AngularJS (ng-inlude), mas mesmo assim não é garantido que rodará em todos os browsers se executado diretamente no browser e não via servidor.
É um péssima prática e uma tremenda gambiarra e não aconselho usar e vou citar aqui somente como aprendizado, mas pode-se usar a tag frameset (descontinuada) ou iFrame.
Mas volto a ressaltar que é um solução horrível, amadora e que vai gerar alguns transtornos, mas funciona.
Aconselho que a principio crie a páginas repetindo as partes comuns, como motrei no meu vídeo ai sim vai funcionar. Sei que é trabalhoso, mas é melhor que usar gambiarras.
A solução mais profissional é usar uma linguagem back-end.
GOSTEI 0
André Salgueiro
06/05/2016
William (Devwilliam).
Fico muito feliz pelo elogio, ainda mais vindo de você, uma pessoa que admiro.
Tenho vontade de criar uma série de vídeos para compartilhar o conhecimento, mas não esta me sobrando tempo.
E para fazer isto gostaria de fazer com um conteúdo e organizado o que demanda tempo e dedicação.
André Salgueiro.
Usando somente HTML você não conseguirá fazer o que quer. Para conseguir usar este 'include' vai ser necessário uma linguagem front-end ou um framework tipo AngularJS (ng-inlude), mas mesmo assim não é garantido que rodará em todos os browsers se executado diretamente no browser e não via servidor.
É um péssima prática e uma tremenda gambiarra e não aconselho usar e vou citar aqui somente como aprendizado, mas pode-se usar a tag frameset (descontinuada) ou iFrame.
Mas volto a ressaltar que é um solução horrível, amadora e que vai gerar alguns transtornos, mas funciona.
Aconselho que a principio crie a páginas repetindo as partes comuns, como motrei no meu vídeo ai sim vai funcionar. Sei que é trabalhoso, mas é melhor que usar gambiarras.
A solução mais profissional é usar uma linguagem back-end.
Fico muito feliz pelo elogio, ainda mais vindo de você, uma pessoa que admiro.
Tenho vontade de criar uma série de vídeos para compartilhar o conhecimento, mas não esta me sobrando tempo.
E para fazer isto gostaria de fazer com um conteúdo e organizado o que demanda tempo e dedicação.
André Salgueiro.
Usando somente HTML você não conseguirá fazer o que quer. Para conseguir usar este 'include' vai ser necessário uma linguagem front-end ou um framework tipo AngularJS (ng-inlude), mas mesmo assim não é garantido que rodará em todos os browsers se executado diretamente no browser e não via servidor.
É um péssima prática e uma tremenda gambiarra e não aconselho usar e vou citar aqui somente como aprendizado, mas pode-se usar a tag frameset (descontinuada) ou iFrame.
Mas volto a ressaltar que é um solução horrível, amadora e que vai gerar alguns transtornos, mas funciona.
Aconselho que a principio crie a páginas repetindo as partes comuns, como motrei no meu vídeo ai sim vai funcionar. Sei que é trabalhoso, mas é melhor que usar gambiarras.
A solução mais profissional é usar uma linguagem back-end.
O frameset eu conheço e implementei na página que estou criando como aprendizado, justamente por estar ultrapassado, estou tentando substitui-lo, por isso, estou com estas dúvidas.
O seu vídeo utilizando PHP parece simples, não conheço a linguagem mais vou estudar, mais fiquei com a seguinte dúvida:
Vc usa o
<?php include 'topo.php;?'>
GOSTEI 0
Jothaz
06/05/2016
Com eu disse frameset esta descontinuado e iFrame não é a melhor foram de criar lay-outs.
O melhor caminho é uma linguagem back-end PHP, Java ou .Net. Eu não sou fã de PHP, mas para quem esta começando quebra um galho e é bem simples.
No caso de o camando é o "include" o 'topo.php;' é a página a ser carregada.
Neste exemplo é o todop.php, mas poderia ser o rodape.php ou qualuqer outra parte do lay out que seria comum a todo o site.
Dentro desta página você colocaria seu HTML e salva com a extensão .PHP para rodar no servidor.
O que seria feito e fatiar o lay-out e as parte comuns seria usadas em conjunto com o "include" para montar o lay-out todo.
No vídeo que postei faço justamente isto, acho que se assistir consegue entender.
Outro caminho é usar o a diretiva "ng-include" do framework AngularJs que faz o mesmo, mas a curva do AngularJs para iniciante pode ser alta.
Sobre servidores pode instalar o que você preferir o IIS já vem como o Windows é só ativá-lo e instalar o pacote para rodar o PHP, mas use o que preferir.
O melhor caminho é uma linguagem back-end PHP, Java ou .Net. Eu não sou fã de PHP, mas para quem esta começando quebra um galho e é bem simples.
No caso de
<?php include 'topo.php;'?>
Neste exemplo é o todop.php, mas poderia ser o rodape.php ou qualuqer outra parte do lay out que seria comum a todo o site.
Dentro desta página você colocaria seu HTML e salva com a extensão .PHP para rodar no servidor.
O que seria feito e fatiar o lay-out e as parte comuns seria usadas em conjunto com o "include" para montar o lay-out todo.
No vídeo que postei faço justamente isto, acho que se assistir consegue entender.
Outro caminho é usar o a diretiva "ng-include" do framework AngularJs que faz o mesmo, mas a curva do AngularJs para iniciante pode ser alta.
Sobre servidores pode instalar o que você preferir o IIS já vem como o Windows é só ativá-lo e instalar o pacote para rodar o PHP, mas use o que preferir.
GOSTEI 0
André Salgueiro
06/05/2016
Com eu disse frameset esta descontinuado e iFrame não é a melhor foram de criar lay-outs.
O melhor caminho é uma linguagem back-end PHP, Java ou .Net. Eu não sou fã de PHP, mas para quem esta começando quebra um galho e é bem simples.
No caso de o camando é o "include" o 'topo.php;' é a página a ser carregada.
Neste exemplo é o todop.php, mas poderia ser o rodape.php ou qualuqer outra parte do lay out que seria comum a todo o site.
Dentro desta página você colocaria seu HTML e salva com a extensão .PHP para rodar no servidor.
O que seria feito e fatiar o lay-out e as parte comuns seria usadas em conjunto com o "include" para montar o lay-out todo.
No vídeo que postei faço justamente isto, acho que se assistir consegue entender.
Outro caminho é usar o a diretiva "ng-include" do framework AngularJs que faz o mesmo, mas a curva do AngularJs para iniciante pode ser alta.
Sobre servidores pode instalar o que você preferir o IIS já vem como o Windows é só ativá-lo e instalar o pacote para rodar o PHP, mas use o que preferir.
O melhor caminho é uma linguagem back-end PHP, Java ou .Net. Eu não sou fã de PHP, mas para quem esta começando quebra um galho e é bem simples.
No caso de
<?php include 'topo.php;'?>
Neste exemplo é o todop.php, mas poderia ser o rodape.php ou qualuqer outra parte do lay out que seria comum a todo o site.
Dentro desta página você colocaria seu HTML e salva com a extensão .PHP para rodar no servidor.
O que seria feito e fatiar o lay-out e as parte comuns seria usadas em conjunto com o "include" para montar o lay-out todo.
No vídeo que postei faço justamente isto, acho que se assistir consegue entender.
Outro caminho é usar o a diretiva "ng-include" do framework AngularJs que faz o mesmo, mas a curva do AngularJs para iniciante pode ser alta.
Sobre servidores pode instalar o que você preferir o IIS já vem como o Windows é só ativá-lo e instalar o pacote para rodar o PHP, mas use o que preferir.
Blz! Vou proceder conforme o recomendado e postar o resultado aqui para ajudar outras pessoas. Obrigado pela ajuda!
GOSTEI 0