Ir para conteúdo

Arquivado

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

Folker

Jquery load não funciona =/

Por , em Javascript

Recommended Posts

Folker    0

Folker
Postado

Gente....ja procurei inumeros tutoriais, posts aqui, ja tentei todos, e simplismente, e com certeza por burrice minha, não consigo faze um load de um arquivo html para uma div da minha página >_<"

 

Segue um exemplo que eu julgo ser bem simples do Load, e comigo simplismente não acontece nada......

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>testando load</title>
<script type="text/javascript">

$('#btn').click(function() {

$('#main').load('http://www.terra.com.br'); 

});

</script>
</head>

<body>
<a href="#" id="btn">Link</a>
<div id="main"></div>

<script type="application/javascript" src="js/jquery.js"></script>
</body>
</html>

 

 

Alguem me da uma luz ae please xD

Compartilhar este post

Link para o post
Compartilhar em outros sites

Bergs    53

Bergs
Postado

a biblioteca jquery deve vir antes dos outros scritps jquery, no head ou antes do fim do body:

 

<html>
<head>
<script src="jquery.js"></script>
<script>
scripts jquery...
</script>
</head>
<body>


ou aqui:
<script src="jquery.js"></script>
<script>
scripts jquery...
</script>
</body>
</html>

Compartilhar este post

Link para o post
Compartilhar em outros sites

Folker    0

Folker
Postado

Alterei para:

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="application/javascript" src="js/jquery.js"></script>
<script type="text/javascript">

$('#btn').click(function() {

$('#main').load('http://www.google.com.br'); 

});

</script>
</head>

<body>
<a href="" id="btn">Link</a>
<div id="main" style="border: 2px solid black; width:500px; height: 500px; left: 30%; top:10%;">
</div>


</body>
</html>

 

 

 

E tambem por via das duvidas para:

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>

</head>

<body>
<a href="" id="btn">Link</a>
<div id="main" style="border: 2px solid black; width:500px; height: 500px; left: 30%; top:10%;">
</div>

<script type="application/javascript" src="js/jquery.js"></script>
<script type="text/javascript">

$('#btn').click(function() {

$('#main').load('http://www.google.com.br'); 

});

</script>

</body>
</html>

 

 

E a mesma coisa....clico e não acontece nada =/ tanto local quanto na net =/

Compartilhar este post

Link para o post
Compartilhar em outros sites

Bergs    53

Bergs
Postado

troque application/javascript para text/javascript

 

Obs: faça o teste com suas páginas ao invés de domínios de terceiros isso pode não funcionar....

Compartilhar este post

Link para o post
Compartilhar em outros sites

Folker    0

Folker
Postado

Bergs.....valeus pelas respostas brother....mais ainda num deu nada =/ Fiz as mudanças como você sugeriu, fiz um arquivo servicos.html no mesmo diretório do principal:

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>

</head>

<body>
<a href="" id="btn">Link</a>
<div id="main">
</div>

<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript">

$('#btn').click(function() {

$('#main').load('servicos.html'); 

});

</script>

</body>
</html>

 

 

E ainda nada =/ O que me deixa de cara que é uma coisa que eu vejo que a galera faz tão básico, e eu ja consultei uns 30 tópicos, 20 tutoriais e nada resolve pra mim >_<"

Compartilhar este post

Link para o post
Compartilhar em outros sites

Bergs    53

Bergs
Postado

vc está esquecendo da função de iniciação do jquery

<script type="text/javascript">
$(document).ready(function(){
$('#btn').click(function() {

$('#main').load('servicos.html'); 

});

});

</script>

 

obs: coloque também um link cego no seu botão ex: <a href="javascript:;" id="btn">link</a>

Compartilhar este post

Link para o post
Compartilhar em outros sites

Folker    0

Folker
Postado

Fiz as devidas mudanças e ainda nada =/ Desde ja agradeço Bergs!

 

Segue a página hospedade ja que estou tentando fazer:

 

http://ecoprez.com/t/load.html

 

E a página que quero carregar é a

http://ecoprez.com/t/servicos.html

 

Meu código ficou assim:

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>

<body>
<a href=""javascript:;"" id="btn">Link</a>
<div id="main" style="width:500px; height:500px; top: 10%; left:10%; border: 2px solid black;">
</div>

<script type="text/javascript" src="js/jquery.js"></script>

<script type="text/javascript">
$(document).ready(function(){
$('#btn').click(function() {
$('#main').load('http://ecoprez.com/t/servicos.html'); //tentei tambem ('servicos.html')
});

});


</script>

</body>
</html>

Compartilhar este post

Link para o post
Compartilhar em outros sites

Bergs    53

Bergs
Postado

vc acrecentou 4 aspas <a href=""javascript:;"" id="btn">Link</a> no link deixe apenas 2...

 

 

OBS: mais atenção!

Compartilhar este post

Link para o post
Compartilhar em outros sites

Folker    0

Folker
Postado

Acho que fecho o bigode Bergs.....Consegui carrega a página dentro do div!

 

Acabei pecando nos detalhes >_<"

Muito obrigado pela atenção. Marcando como resolvido.

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