JQuery - AJAX e o método load()
O método load veio para facilitar a vida do desenvolvedor, eu mesmo já usei muito para soluções onde queria deixar o código mais limpo...
Temos um simples exemplo de como utilizá-lo:
Segundo a documentação do pessoal do jquery a sintaxe é $("url parametros, callback");
- url: A URL que é solicitada a requisição.
- parâmetros: Um objeto cuja propriedades são serializadas em uma série de parâmetros codificados corretamente e que se passam a requisição. Se utilizado, deve-se especificar se a requisição utiliza o método POST, caso contrário, se omitido, a requisição utiliza o método GET.
- callback: Uma função chamada após a solicitação já ter sido processada.
HTML:
<html> <body> <div id="divPrincipal"> <span>Conteúdo</span> </div> <button id="btnEnviar">Enviar</button> </body> </html>
Exibição:
Conteúdo
Javascript:
$("#btnEnviar").on("click",function(){
$("#divPrincipal").load("http://suaurl.com");
});
Explicação:
Ao clicar no botão enviar é disparado o evento de clique dizendo que na divPrincipal deve ser carregado esse conteúdo que seria a url, poderia ser uma ação passando parametros também :
$("#divPrincipal").load("http://suaurl.com?acao=login");
ou então se você quisesse carregar nesse div apenas uma div nessa outra página:
$("#divPrincipal").load("http://suaurl.com #div2");
E ao final de tudo adicionar uma mensagem de retorno (callback) retornando o sucesso:
$("#divPrincipal").load("http://suaurl.com #div2", function(){
alert("Sucesso!");
});