Skip to content

Instantly share code, notes, and snippets.

@gabizinha12
Forked from filipemansano/getcep.html
Created April 21, 2023 21:54
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save gabizinha12/01179d78bf0f7783b5dec56673077cad to your computer and use it in GitHub Desktop.
Save gabizinha12/01179d78bf0f7783b5dec56673077cad to your computer and use it in GitHub Desktop.
Exemplo básico de consulta de CEP consumindo uma API em jQuery
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Pesquisa CEP</title>
</head>
<body>
<input type="text" name="cep" id="cep">
<button type="button" id="pesquisarCEP">Pesquisar CEP</button>
<span id="loading" style="display:none;">[Carregando...]</span>
<hr>
logradouro: <strong><span id="logradouro"></span></strong><br/>
complemento: <strong><span id="complemento"></span></strong><br/>
bairro: <strong><span id="bairro"></span></strong><br/>
localidade: <strong><span id="localidade"></span></strong><br/>
uf: <strong><span id="uf"></span></strong><br/>
unidade: <strong><span id="unidade"></span></strong>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$("#pesquisarCEP").on("click", function(){
var loading = $("#loading");
var cep = $("#cep").val().replace(/[^0-9]/g,'');
loading.show();
if(cep !== "" && cep.length == 8){
$.ajax({
url: "https://viacep.com.br/ws/"+cep+"/json/",
type: "GET",
dataType: "json",
success: function (data) {
if(data.erro !== undefined){
alert("CEP inválido ou não encontrado");
}else{
$("#logradouro").text(data.logradouro);
$("#complemento").text(data.complemento);
$("#bairro").text(data.bairro);
$("#localidade").text(data.localidade);
$("#uf").text(data.uf);
$("#unidade").text(data.unidade);
}
},
error: function(data){
alert("Algum erro ocorreu, consulte o log.");
},
complete: function(){
loading.hide();
}
});
}else{
alert("CEP deve conter 8 digitos");
}
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment