Ir para conteúdo

POWERED BY:

Arquivado

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

Heur

[Resolvido] Função load() em jQuery.

Por , em Javascript

Recommended Posts

Heur    0

Heur
Postado

E ae povo.

 

Queria uma ajudinha no jQuery.

Eu tenho uma pagina html com apenas uns poucos campos,

só para teste mesmo. A estrutura dela é essa:

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>New Web Project</title>
        <link rel="stylesheet" type="text/css" href="styles.css" />
        <script type="text/javascript" src="jquery.min.js"></script>
        <script type="text/javascript" src="javas.js"></script>
    </head>
    <body>
        <div id="body">
          <a id="show" href="" align="center"><h3>Click para exibir o texto.</h3></a>
          <div id="container"></div>
        </div>
    </body>
</html>

Eu quero carregar dentro do meu container o conteudo dessa pagina:

 

<h1>Hello World!</h1>

Com esse código jQuery:

 

$(document).ready(function() {
  $("#show").click(function() {
    $("#container").load("load.html h1");
  });
});

Pois é. Não tá carregando.

Quero que o Hello World h1 apareça dentro do div container.

Não tá certo?

 

Alguém me dá uma dica?

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

você precisa cancelar a ação o link, se não você perde a requisição.

$(document).ready(function(){
	$("#show").click(function( e ){
		e.preventDefault();
		$("#container").load("load.html h1");
	});
});

Compartilhar este post

Link para o post
Compartilhar em outros sites

Heur    0

Heur
Postado

Tá.

 

Fiz o que recomendou.

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>New Web Project</title>
        <link rel="stylesheet" type="text/css" href="styles.css" />
    </head>
    <body>
        <a id="show" href="" align="center"><h3>Click para exibir o texto.</h3></a>
        <div id="container"></div>
                
        <script type="text/javascript" src="jquery.min.js"></script>
        <script type="text/javascript" src="javas.js"></script>
    </body>
</html>

$(document).ready(function() {
  $('#show').click(function(e) {
  	e.preventDefault();
    $("#container").load("page.html h1");
  });
});

Porém ele continua não funcionando.

Eu vou tentando, se tiverem mais dicas, agradeço.

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>New Web Project</title>
        <link rel="stylesheet" type="text/css" href="styles.css" />
        <script type="text/javascript" src="jquery.min.js"></script>
        <script type="text/javascript">
		$(document).ready(function(){
			$('#show').click(function( e ){
				e.preventDefault();
				$("#container").load("page.html h1");
			});
		});		
		</script>
    </head>
    <body>
        <a id="show" href="" align="center"><h3>Click para exibir o texto.</h3></a>
        <div id="container"></div>
    </body>
</html>

page.html


		<h1>Titulo page.html</h1>

testei aqui, e está tudo certo.

Se não funcionar ainda, confira o nome e caminho para o arquivo do jQuery

 

$(document).ready(function(){
			alert( 'jQuery iniciado!' );
se não aparecer esse alert, você não incluiu a biblioteca corretamente.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Bruno Augusto    417

Bruno Augusto
Postado

Você usa o Firebug?

 

Se usar, estando com ele habilitado para a página em que está trabalhando, após fazer a requisição, abra-o e na aba Rede procure pelo arquivo que deveria estar sendo carregado.

 

Se estiver em vermelho, justifica-se o fato de não estar funcionando, pois o script não está alcançando o mesmo.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Heur    0

Heur
Postado

Aaaah.

Eu to usando Google Chrome.

Testei no Mozilla e deu certo! :D

 

Tem algum jeito de fazer dar certo no Chrome?

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

Funcionou no meu chrome também.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Heur    0

Heur
Postado

Estranho.

No meu não deu certo.

=/

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

aperte:

 

Ctrl + Shif + J

vá na aba Console, e veja se aparecem erros.

 

O alert do 'jQuery iniciado' aparece no teu Chrome ? está com suporte a javascript ativado ?

Compartilhar este post

Link para o post
Compartilhar em outros sites

Heur    0

Heur
Postado

Opa.

Deu certo.

Todou perfeitamente, no Chrome também ;)

Obrigado povo

Compartilhar este post

Link para o post
Compartilhar em outros sites

Heur    0

Heur
Postado

Pessoal.

Aproveitando o tópico,

como posso por um efeito de fade quando ele importar

do outro html?

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado 

$(document).ready(function(){

$('#show').click(function( e ){

e.preventDefault();

$("#container").hide();

$("#container").fadeIn('slow').load("page.html h1");

});

});

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