jQuery - Método AJAX load()
Método jQuery load()
O método jQuery load()
é um método AJAX simples, mas poderoso.
O load()
método carrega dados de um servidor e coloca os dados retornados no elemento selecionado.
Sintaxe:
$(selector).load(URL,data,callback);
O parâmetro URL obrigatório especifica o URL que você deseja carregar.
O parâmetro de dados opcional especifica um conjunto de pares de chave/valor de string de consulta para enviar junto com a solicitação.
O parâmetro de retorno de chamada opcional é o nome de uma função a ser executada após a conclusão do load()
método.
Aqui está o conteúdo do nosso arquivo de exemplo: "demo_test.txt":
<h2>jQuery and AJAX is FUN!!!</h2>
<p id="p1">This is some text in a paragraph.</p>
O exemplo a seguir carrega o conteúdo do arquivo "demo_test.txt" em um <div>
elemento específico:
Exemplo
$("#div1").load("demo_test.txt");
Também é possível adicionar um seletor jQuery ao parâmetro URL.
O exemplo a seguir carrega o conteúdo do elemento com id="p1", dentro do arquivo "demo_test.txt", em um <div>
elemento específico:
Exemplo
$("#div1").load("demo_test.txt #p1");
O parâmetro de retorno de chamada opcional especifica uma função de retorno de chamada a ser executada quando o
load()
método for concluído. A função de retorno de chamada pode ter diferentes parâmetros:
responseTxt
- contém o conteúdo resultante se a chamada for bem-sucedidastatusTxt
- contém o status da chamadaxhr
- contém o objeto XMLHttpRequest
O exemplo a seguir exibe uma caixa de alerta após a conclusão do método load(). Se o load()
método for bem-sucedido, ele exibirá "Conteúdo externo carregado com sucesso!" e, se falhar, exibirá uma mensagem de erro:
Exemplo
$("button").click(function(){
$("#div1").load("demo_test.txt", function(responseTxt, statusTxt, xhr){
if(statusTxt == "success")
alert("External content loaded successfully!");
if(statusTxt == "error")
alert("Error: " + xhr.status + ": " + xhr.statusText);
});
});
Referência AJAX do jQuery
Para uma visão geral completa de todos os métodos do jQuery AJAX, acesse nossa Referência do jQuery AJAX .