Localização de endereço através do CEP usando jQuery

Nesse tutorial vou mostrar como facilitar o preenchimento de formulário que contenha campos de endereço, tornando seu preenchido automático para alguns campos.

Por | @jonathanlamimkt Programação

Nesse tutorial vou mostrar como facilitar o preenchimento de formulário que contenha campos de endereço. Quanto menos o usuário tiver que digitar para preencher um formulário, mais feliz ele ficará.

Para esse tutorial nós vamos utilizar o web service da República Virtual, para fazermos a localização a partir do CEP e também a última versão da biblioteca jQuery.

Antes de começarmos a escrever os códigos, é preciso saber as informações que devem ser enviadas ao web service e o seu endereço para requisição. Vejamos:

URL WebService: http://cep.republicavirtual.com.br/web_cep.php

Variáveis de entrada
cep: númerico com 8 dígitos (Ex: 90200971)
formato: xml, json, query_string ou javascript

Agora que já sabemos quais informações precisam ser enviadas ao web service, podemos começar a desenvolver o código.

Antes de mais nada certifique-se dos seguintes itens:

- Ter feito o download da última versão da biblioteca jQuery;
- Ter um editor de texto para escrever os códigos;
- Ter instalado o Firefox ou outro navegador para poder testar os códigos escritos;
- Criar uma pasta para salvar os arquivos deste tutorial;

Vamos começar criando o formulário que o usuário deverá preencher. Não utilizaremos muitos campos nesse tutorial, somente os campos de cep, cidade e estado. Você pode ficar a vontade para colocar no formulário os campos que forem preciso.

Abra o editor de textos e antes de escrever o código salve o arquivo com o nome "form.html", dentro da pasta criada. Após salvar digite o código a seguir e depois salve o arquivo novamente.

Ao digitar, substitua "localizacao_do_arquivo_jquery" pelo caminho do arquivo ".js" da biblioteca jQuery e substitua também "localizacao_do_arquivo_com_o_codigo_js" pelo endereço de localização do arquivo da biblioteca jQuery, só que ao invés de chamar a biblioteca, você chamará o arquivo "getEndereco.js".


    
        Localização de endereço através do CEP usando jQuery e PHP</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <script src="localizacao_do_arquivo_jquery" type="text/javascript"></script>
	<script src="localizacao_do_arquivo_com_o_codigo_js" type="text/javascript"></script>        
    </head>
    <body>
        Cep: <input type="text" maxlength="8" value="" id="cep"/><input type="button" id="getEndereco" value="Pesquisar"/><br/>
        <p id="loadingCep"></p>
        Cidade: <input type="text" readonly="readonly" id="cidade"/><br/>
        Estado: <input type="text" readonly="readonly" id="estado"/>
    </body>
</html></code></pre><br />
<br />
Se você reparar, o único campo que está disponível para edição é o do CEP, os demais (cidade e estado) estão bloqueados, pois serão preenchidos automaticamente.<br />
<br />
O botão <strong>"Pesquisar"</strong> é o responsável por executar a operação de pesquisa, enviando o CEP informado para o web service, e retornando os dados encontrados, ou até mesmos erros.<br />
<br />
A tag <strong>< p ></strong> com o id <em>loadingCep</em> será a responsável por exibir as mensagens retornadas, conforme a execução da pesquisa.<br />
<br />
Com o código do formulário pronto, crie um arquivo JS e salve-o com o nome de <strong>"getEndereco.js"</strong>, na mesma pasta onde está o arquivo da biblioteca jQuery. Em seguida, digite o código abaixo:<br />
<br />
<pre><code>function getEndereco(cep) {
    if($.trim(cep) != ""){
        $("#loadingCep").html('Pesquisando...');
        $.getScript("http://cep.republicavirtual.com.br/web_cep.php?formato=javascript&cep="+cep, function(){            
            if (resultadoCEP["resultado"] != 0) {
                $("#cidade").val(unescape(resultadoCEP["cidade"]));
                $("#estado").val(unescape(resultadoCEP["uf"]));
            }else{
                $("#loadingCep").html(unescape(resultadoCEP["resultado_txt"]));                
            }            
        });
    }
    else{
        $("#loadingCep").html('Informe o CEP');
    }
}</code></pre><br />
<br />
Nesse arquivo temos somente uma função, a <em>getEndereço(cep)</em>, que precisa de um parâmetro, que é o <a href='https://www.oficinadanet.com.br/artigo/99/descobrindo_a_cidade_estado_e_cep_de_qualquer_usuario'>cep</a> informado pelo usuário.<br />
<br />
Começamos a função verificando se o cep foi informado, se ele estiver em branco, emitimos um alerta para o usuário. caso tenha sido preenchido, seguimos com a verificação.<br />
<br />
Para enviar a requisição ao web service, usamos o método <strong>$.getScript</strong>, do jQuery, que é muito similar ao <strong>$.ajax</strong>. Passamos nesse método o parâmetro que corresponde à url do web service, incluindo as informações obrigatórias, que são o cep e o formato. Para esse exemplo vamos usar o formato "javascript" que irá nos retornar um array com as informações.<br />
<br />
Veja um exemplo do array retornado:<br />
<br />
<pre><code>var resultadoCEP = {
	'uf' 			: 'RS',
	'cidade' 		: 'Porto%20Alegre',
	'bairro' 		: 'Passo%20D%27Areia',
	'tipo_logradouro' 	: 'Avenida',
	'logradouro' 		: 'Assis%20Brasil',
	'resultado' 		: '1',
	'resultado_txt' 	: 'sucesso%20-%20cep%20completo'
}</code></pre><br />
<br />
Os dados retornados na chave "resultado" e "resultado_txt" podem variar. A seguir veja quais podem ser essas variações:<br />
<br />
<pre><code>var resultadoCEP = { 
	'uf' : 'ES', 
	'cidade' : 'Marata%EDzes', 
	'bairro' : '', 
	'tipo_logradouro' : '', 
	'logradouro' : '', 	
	'resultado' : '2', 
	'resultado_txt' : 'sucesso%20-%20cep%20%FAnico' 
}</code></pre><br />
<br />
Nesse caso, não há informações sobre o nome da rua, o tipo de logradouro (rua, avenida, travessa ou outros) e o bairro. O resultado informado é "2" e o resultado_txt é "sucesso - cep único".<br />
<br />
<pre><code>var resultadoCEP = { 
	'uf' : '', 
	'cidade' : '', 
	'bairro' : '', 
	'tipo_logradouro' : '', 
	'logradouro' : '', 
	'resultado' : '0', 
	'resultado_txt' : 'servi%E7o%20indispon%EDvel%2Fcep%20inv%E1lido' 
}</code></pre><br />
<br />
Se o resultado for "0", então é porque o cep não foi encontrado ou o serviço está indisponível.<br />
<br />
Essas informações são importantes para que você possa fazer uma validação mais precisa e informar ao usuário o que ocorreu.<br />
<br />
Quando chamamos o método getScript, ele automaticamente já retorna os dados vindos do web service, nesse caso, o array resultadoCEP. Com o array, fazemos então a verificação se o resultado é diferente de "0" (zero), pois se for, então não ocorreram erros, e o cep é válido. Se ocorrer algum erro, então informamos ao usuário. Repare que é utilizado o método "unescape" sempre que os dados vindos do array precisam ser exibidos; o seu uso é necessário pois precisamos decodificar os dados, uma vez que eles vêm codificados.<br />
<br />
Não havendo erros, então nós inserimos os dados nos respectivos campos do formulário, poupando o usuário de ter que digitar essas informações.<br />
<br />
Nosso código ainda não está 1005 concluído, é preciso chamar a execução do método getEndereco quando o usuário clicar no botão "Pesquisar". Para isso, volte ao arquivo form.html e logo após a linha <br />
<pre><code><script src="localizacao_do_arquivo_com_o_codigo_js" type="text/javascript"></script></code></pre><br />
<br />
E coloque o código abaixo:<br />
<br />
<pre><code><script type="text/javascript">
	$(document).ready(function(){
        	$("#getEndereco").click(function(){
        		getEndereco($("#cep").val());
        	}); 
     	});
</script></code></pre><br />
<br />
Você pode criar vários tipos de validação dentro do evento click do botão pesquisar, mas como esse não é o foco do tutorial, deixarei que sua criatividade o leve a fazer essas validações.<br />
<br />
Agora que seu código está pronto, certifique-se de que todos os arquivos estejam salvos, se não estiverem, salve-os e vá até o navegador (browser) e teste o seu código.<br />
<br />
Vou deixar aqui algumas dicas de validação que você poderá utilizar na hora de validar os dados do cep enviados pelo usuário.<br />
<br />
- Verifique se o cep possui 8 caracteres<br />
- Verifique se todos os caracteres são numéricos<br />
- Não deixe que o usuário digite o traço, somente números<br />
<br />
Bom pessoal, espero que tenham gostado! Deixem seus comentários se tiverem dúvidas ou sugestões.</p></p><script src="https://painel.m3midia.com.br/lib/prism/prism.js"></script><link rel="stylesheet" type="text/css" href="https://painel.m3midia.com.br/lib/prism/prism.css">
                    </div><script type="text/javascript">try { _402_Show(); } catch(e) {}</script>
                </div>
                <div class="wifl conteudo"><p class="wifl"><strong>Você também pode gostar de:</strong></p><ul><li><a onclick="_gaq.push(['_trackEvent', 'relacionadolink', 'pfr2979', 'pto12811']);" href="https://www.oficinadanet.com.br/post/12811-formulario-de-contato-em-php">Formulário de contato em php</a></li><li><a onclick="_gaq.push(['_trackEvent', 'relacionadolink', 'pfr2979', 'pto9518']);" href="https://www.oficinadanet.com.br/post/9518-upload-de-imagens-php-com-uploadify">Upload de imagens e arquivos PHP com Uploadify</a></li><li><a onclick="_gaq.push(['_trackEvent', 'relacionadolink', 'pfr2979', 'pto1355']);" href="https://www.oficinadanet.com.br/artigo/1589/jquery_rating_-_sistema_de_votacao_interativa">jQuery Rating - Sistema de votação interativa</a></li><li><a onclick="_gaq.push(['_trackEvent', 'relacionadolink', 'pfr2979', 'pto8598']);" href="https://www.oficinadanet.com.br/post/8598-sistema-de-votacao-thumbs-up-com-phpmysqljquery">Sistema de votação thumbs up com PHP/MySQL/jQuery</a></li><li><a onclick="_gaq.push(['_trackEvent', 'relacionadolink', 'pfr2979', 'pto8365']);" href="https://www.oficinadanet.com.br/multimidia-view/criando-slide-de-imagens-com-o-coin-slider-em-jquery">Criando slide de imagens com o Coin Slider em jQuery</a></li><li><a onclick="_gaq.push(['_trackEvent', 'relacionadolink', 'pfr2979', 'pto2635']);" href="https://www.oficinadanet.com.br/artigo/css/galeria-com-miniatura-deslizante-usando-css3">Galeria com miniatura deslizante usando CSS3</a></li><li><a onclick="_gaq.push(['_trackEvent', 'relacionadolink', 'pfr2979', 'pto2873']);" href="https://www.oficinadanet.com.br/artigo/javascript/efeito-toggle-com-css-e-jquery">Efeito Toggle com CSS e JQuery</a></li><li><a onclick="_gaq.push(['_trackEvent', 'relacionadolink', 'pfr2979', 'pto2870']);" href="https://www.oficinadanet.com.br/artigo/javascript/como-criar-um-tooltip-em-jquery-e-css">Como criar um tooltip em jQuery e CSS</a></li><li><a onclick="_gaq.push(['_trackEvent', 'relacionadolink', 'pfr2979', 'pto2766']);" href="https://www.oficinadanet.com.br/artigo/css/css-lightbox-com-detalhes">CSS lightbox com detalhes</a></li><li><a onclick="_gaq.push(['_trackEvent', 'relacionadolink', 'pfr2979', 'pto2842']);" href="https://www.oficinadanet.com.br/artigo/mobile/jquery-mobile-o-que-ele-pode-fazer-por-voce">jQuery Mobile: O que ele pode fazer por você?</a></li></ul></div>
                <div class="wifl banner" id="bottom_conteudo">
<div style="width: 300px; height: 250px; float: left;">
<!-- /6524261/ON_FOOTER -->
<div id="div-gpt-ad-1488805256777-0" style="height:250px; width:300px;">
<script>
googletag.cmd.push(function() { googletag.display("div-gpt-ad-1488805256777-0"); });
</script>
</div>
</div>
<div style="width: 300px; height: 250px; float: right;" >
<!-- /6524261/ON_300x250_CONTEUDO_BOTTOM -->
<div id="div-gpt-ad-1488805701155-0" style="height:250px; width:300px;">
<script>
googletag.cmd.push(function() { googletag.display("div-gpt-ad-1488805701155-0"); });
</script>
</div>
</div></div>
            </div>  
        <div class="bar2 p-rel" id="out_post_barra" data-distance="30" >
            <div class="bar2" id="post_barra" ><span class="titulo1" ><span>Recomendado</span></span><ul class="lst12 m-b-40 wifl  lsn "  ><li  >
                            <a class="" href="https://www.oficinadanet.com.br/post/15559-curso-php-oficinadanet-premium"  onclick="_gaq.push(['_trackEvent', 'barra_conteudo_relacionado', 'pfr2979', 'pto15559']);"    >
                                <span class="img box-img2" >
                                    <img src="https://www.oficinadanet.com.br/imagens/post/15559/td_php-big_mini_14080.jpg" title="Quer aprender PHP? Saiba mais" alt="Quer aprender PHP? Saiba mais" >
                                </span>
                                <div class="info" >
                                    <span class="tit" >php</span>
                                    <h3 class="tit tit2" >Quer aprender PHP? Saiba mais</h3>
                                </div>
                            </a>
                        </li></ul>
                    <div class="box1 redes barra m-b-30" >
                        <span class="tit cor1" >Siga nas redes</span>
                        <div class="wifl bts-redes" >
                            <a href="https://feeds2.feedburner.com/oficinadanet_Rss" rel="nofollow" class="bt2-rss bg10" ></a>
                            <a href="https://www.facebook.com/oficinadanet" rel="nofollow" target="_blank" class="bt2-facebook bg9" ></a>
                            <a href="https://twitter.com/oficinadanet" rel="nofollow" target="_blank" class="bt2-twitter bg8" ></a>
                            <a href="https://www.instagram.com/oficinadanetoficial" rel="nofollow" target="_blank" class="bt2-instagram bg11" ></a>
                        </div>
                    </div><span class="titulo1 m-t-10" ><span>Últimas publicações</span></span><ul class="lst27  wifl  lsn "  ><li  >
                            <span class="txt txt2" >Entretenimento</span>
                            <a   onclick="_gaq.push(['_trackEvent', 'ultimos_barra_lst', 'pfr2979', 'pto18888']);"  class="txt txt1" href="https://www.oficinadanet.com.br/post/18888-titulos-que-serao-removidos-da-netflix-em-maio-de-2017-1-quinzena" ><b>Títulos que serão removidos da Netflix em maio de 2017 - 1ª quinzena</b></a>
                        </li><li  >
                            <span class="txt txt2" >Segurança digital</span>
                            <a   onclick="_gaq.push(['_trackEvent', 'ultimos_barra_lst', 'pfr2979', 'pto13423']);"  class="txt txt1" href="https://www.oficinadanet.com.br/post/13423-10-dicas-de-seguranca-para-iniciantes" ><b>10 dicas de segurança na internet para iniciantes</b></a>
                        </li><li  >
                            <span class="txt txt2" >Tecnologia</span>
                            <a   onclick="_gaq.push(['_trackEvent', 'ultimos_barra_lst', 'pfr2979', 'pto18893']);"  class="txt txt1" href="https://www.oficinadanet.com.br/post/18893-apple-nao-ira-mais-fabricar-ipads-no-brasil" ><b>Apple encerra fabricação de iPads no Brasil</b></a>
                        </li><li  >
                            <span class="txt txt2" >Ciência</span>
                            <a   onclick="_gaq.push(['_trackEvent', 'ultimos_barra_lst', 'pfr2979', 'pto18883']);"  class="txt txt1" href="https://www.oficinadanet.com.br/post/18883-pesquisadora-descobre-lagarta-que-degrada-plastico-" ><b>Pesquisadora descobre lagarta que degrada plástico </b></a>
                        </li><li  >
                            <span class="txt txt2" >Smartphones</span>
                            <a   onclick="_gaq.push(['_trackEvent', 'ultimos_barra_lst', 'pfr2979', 'pto18892']);"  class="txt txt1" href="https://www.oficinadanet.com.br/post/18892-samsung-corrige-tela-avermelhada-do-galaxy-s8" ><b>Samsung corrige tela avermelhada do Galaxy S8</b></a>
                        </li><li  >
                            <span class="txt txt2" >Entretenimento</span>
                            <a   onclick="_gaq.push(['_trackEvent', 'ultimos_barra_lst', 'pfr2979', 'pto18890']);"  class="txt txt1" href="https://www.oficinadanet.com.br/post/18890-prison-break-24-horas-e-outras-series-da-fox-nao-irao-mais-integrar-catalogo-da-netflix" ><b>Prison Break, 24 Horas e outras séries da Fox vão sair do catálogo da Netflix</b></a>
                        </li><li  >
                            <span class="txt txt2" >Games</span>
                            <a   onclick="_gaq.push(['_trackEvent', 'ultimos_barra_lst', 'pfr2979', 'pto18889']);"  class="txt txt1" href="https://www.oficinadanet.com.br/post/18889-trailer-mostra-incrivel-jogabilidade-de-marvel-vs-capcom-infinite" ><b>Trailer mostra incrível jogabilidade de Marvel vs Capcom: Infinite</b></a>
                        </li><li  >
                            <span class="txt txt2" >Aplicativos</span>
                            <a   onclick="_gaq.push(['_trackEvent', 'ultimos_barra_lst', 'pfr2979', 'pto18887']);"  class="txt txt1" href="https://www.oficinadanet.com.br/post/18887-facebook-lite-ganha-importantes-recursos-na-atualizacao" ><b>Facebook Lite ganha importantes recursos na atualização</b></a>
                        </li><li  >
                            <span class="txt txt2" >Softwares</span>
                            <a   onclick="_gaq.push(['_trackEvent', 'ultimos_barra_lst', 'pfr2979', 'pto18885']);"  class="txt txt1" href="https://www.oficinadanet.com.br/post/18885-e-possivel-desenhar-no-excel" ><b>É possível desenhar no Excel?!?!</b></a>
                        </li><li  >
                            <span class="txt txt2" >Aplicativos</span>
                            <a   onclick="_gaq.push(['_trackEvent', 'ultimos_barra_lst', 'pfr2979', 'pto18884']);"  class="txt txt1" href="https://www.oficinadanet.com.br/post/18884-jogo-baleia-azul-tira-whatsapp-do-ar-nao-entenda" ><b>Jogo Baleia Azul tira WhatsApp do ar? Não, entenda</b></a>
                        </li></ul>      
        </div>
    </div>  
            <div class="wifl post-bottom1 o-que-ler bottom_pause_post_barra" ><span class="titulo1" ><span>O QUE LER EM SEGUIDA</span></span><ul class="lst4 post wifl  lsn "  ><li  >
                            <a class="" href="https://www.oficinadanet.com.br/artigo/javascript/portfolio-imagem-slider"  onclick="_gaq.push(['_trackEvent', 'oq_ler_conteudo_relacionado', 'pfr2979', 'pto2874']);"  >
                                <div class="img box-img2">
                                    <span class="label_tpl1 fix-bl bg1">Programação</span>
                                    <img src="https://www.oficinadanet.com.br/_template/imagem/padrao.jpg" title="Portfolio image slider com CSS e JQuery" alt="Portfolio image slider com CSS e JQuery" >
                                    <span class="gradient"></span>
                                </div>
                                <h2 class="wifl tit4">Portfolio image slider com CSS e JQuery</h2>
                                <div class="wifl">
                                    <span class="comment cinza">0 | </span><span class="ass-autor cor2">por Thauan Almeida</span>
                                </div>
                            </a>
                        </li><li  >
                            <a class="" href="https://www.oficinadanet.com.br/artigo/javascript/criando-abas-de-navegacao-com-jquery"  onclick="_gaq.push(['_trackEvent', 'oq_ler_conteudo_relacionado', 'pfr2979', 'pto2775']);"  >
                                <div class="img box-img2">
                                    <span class="label_tpl1 fix-bl bg1">Programação</span>
                                    <img src="https://www.oficinadanet.com.br/_template/imagem/padrao.jpg" title="Criando abas de navegação com jQuery" alt="Criando abas de navegação com jQuery" >
                                    <span class="gradient"></span>
                                </div>
                                <h2 class="wifl tit4">Criando abas de navegação com jQuery</h2>
                                <div class="wifl">
                                    <span class="comment cinza">0 | </span><span class="ass-autor cor2">por Roberto Pereira</span>
                                </div>
                            </a>
                        </li><li  >
                            <a class="" href="https://www.oficinadanet.com.br/artigo/javascript/alertas-do-twitter-usando-jquery"  onclick="_gaq.push(['_trackEvent', 'oq_ler_conteudo_relacionado', 'pfr2979', 'pto2707']);"  >
                                <div class="img box-img2">
                                    <span class="label_tpl1 fix-bl bg1">Programação</span>
                                    <img src="https://www.oficinadanet.com.br/_template/imagem/padrao.jpg" title="Criando alertas igual do Twitter usando jQuery" alt="Criando alertas igual do Twitter usando jQuery" >
                                    <span class="gradient"></span>
                                </div>
                                <h2 class="wifl tit4">Criando alertas igual do Twitter usando jQuery</h2>
                                <div class="wifl">
                                    <span class="comment cinza">0 | </span><span class="ass-autor cor2">por Fabrício Julian Carini Montenegro</span>
                                </div>
                            </a>
                        </li><li  >
                            <a class="" href="https://www.oficinadanet.com.br/artigo/javascript/carregando-conteudo-estatico-com-ajax"  onclick="_gaq.push(['_trackEvent', 'oq_ler_conteudo_relacionado', 'pfr2979', 'pto2669']);"  >
                                <div class="img box-img2">
                                    <span class="label_tpl1 fix-bl bg1">Programação</span>
                                    <img src="https://www.oficinadanet.com.br/_template/imagem/padrao.jpg" title="Carregando Conteúdo Estático com AJAX" alt="Carregando Conteúdo Estático com AJAX" >
                                    <span class="gradient"></span>
                                </div>
                                <h2 class="wifl tit4">Carregando Conteúdo Estático com AJAX</h2>
                                <div class="wifl">
                                    <span class="comment cinza">1 | </span><span class="ass-autor cor2">por Suelen Braga</span>
                                </div>
                            </a>
                        </li><li  >
                            <a class="" href="https://www.oficinadanet.com.br/artigo/javascript/criando-um-menu-drop-down-com-jquery"  onclick="_gaq.push(['_trackEvent', 'oq_ler_conteudo_relacionado', 'pfr2979', 'pto2625']);"  >
                                <div class="img box-img2">
                                    <span class="label_tpl1 fix-bl bg1">Programação</span>
                                    <img src="https://www.oficinadanet.com.br/_template/imagem/padrao.jpg" title="Criando um menu drop down com JQUERY" alt="Criando um menu drop down com JQUERY" >
                                    <span class="gradient"></span>
                                </div>
                                <h2 class="wifl tit4">Criando um menu drop down com JQUERY</h2>
                                <div class="wifl">
                                    <span class="comment cinza">0 | </span><span class="ass-autor cor2">por Suelen Braga</span>
                                </div>
                            </a>
                        </li></ul>
            </div>
            <div class="wifl post-bottom1 assuntos " >
                <span class="titulo1 tit_tag" ><span>Assuntos</span>
                <span class="tag" ><a href="https://www.oficinadanet.com.br/tags/jquery" >jquery</a>, <a href="https://www.oficinadanet.com.br/tags/cep" >cep</a> e <a href="https://www.oficinadanet.com.br/tags/endereco" >endereço</a></span>
                </span>
                <div class="share" >
                    <span class="bt1-facebook bg9"  onclick="  window.open('https://www.facebook.com/sharer/sharer.php?app_id=209309632417494&u=https%3A%2F%2Fwww.oficinadanet.com.br%2Fartigo%2Fjavascript%2Flocalizacao-de-endereco-atraves-do-cep-usando-jquery','','width=600,height=400');  ajaxDireto('https://www.oficinadanet.com.br/ajax_oficina.php','act=flgcomment&id=2979','flgcomment');  "  >Compartilhe no Facebook</span>
                    <span class="bt1-twitter bg8"  onclick="  window.open('https://twitter.com/intent/tweet?text=Localiza%C3%A7%C3%A3o+de+endere%C3%A7o+atrav%C3%A9s+do+CEP+usando+jQuery&url=https%3A%2F%2Fwww.oficinadanet.com.br%2Fartigo%2Fjavascript%2Flocalizacao-de-endereco-atraves-do-cep-usando-jquery&via=oficinadanet','','width=600,height=400');  ajaxDireto('https://www.oficinadanet.com.br/ajax_oficina.php','act=flgcomment&twitter=1&id=2979','flgcomment');  "  >Compartilhe no Twitter</span>
                </div>
                
                    <div class="box1 redes " >
                        <span class="tit cor1" >Siga nas redes</span>
                        <div class="wifl bts-redes" >
                            <a href="https://feeds2.feedburner.com/oficinadanet_Rss" rel="nofollow" class="bt2-rss bg10" ></a>
                            <a href="https://www.facebook.com/oficinadanet" rel="nofollow" target="_blank" class="bt2-facebook bg9" ></a>
                            <a href="https://twitter.com/oficinadanet" rel="nofollow" target="_blank" class="bt2-twitter bg8" ></a>
                            <a href="https://www.instagram.com/oficinadanetoficial" rel="nofollow" target="_blank" class="bt2-instagram bg11" ></a>
                        </div>
                    </div>
                <div class="box1 notif-autor" >
                    <span class="tit cor1 corrigir_texto" >Encontrou algum erro no texto?</span>
                    <p>Entre em contato com o autor e nos ajude a melhorar a qualidade dos posts cada vez mais!</p>
                    <span class="bt bt1 bg4 act_corrigir_texto" data-para_email="contato@jonathanlamim.com.br " data-corrigir_titulo="Localização de endereço através do CEP usando jQuery" >AVISAR</span>
                </div>
            </div>
            <div class="wifl post-bottom1" >
                <span class="titulo1 tit_tag" ><span>Comentários</span></span>
                <div id="comment" class="comentarios_box">
                    <div id="disqus_thread"></div>
                </div>
            </div>
        </section>    
    </div></div>
                </section>
<footer class="footer wifl" id="footer">
    <div class="corpo">
        <a href="https://www.oficinadanet.com.br" class="logo2"></a>
        <div class="out-menu-footer">
            <ul class="menu-footer lst-footer1 wifl">
                <li><a href="https://www.oficinadanet.com.br/sobre">Sobre nós</a></li>
                <li><a href="https://www.oficinadanet.com.br/contato">Fale conosco</a></li>
                <li><a href="https://www.oficinadanet.com.br/colunista" >Seja um colunista</a></li>
                <li><a href="https://www.oficinadanet.com.br/equipe" >Equipe</a></li>
            </ul>
            <ul class="menu-footer wifl">
                <li><a href="https://www.facebook.com/oficinadanet">Facebook</a></li>
                <li><a href="https://twitter.com/OficinadaNet">Twitter</a></li>
                <li><a href="https://www.youtube.com/user/oficinadanettv">Youtube</a></li>
                <li><a href="https://www.instagram.com/oficinadanetoficial/">Instagram</a></li>
                <li><a href="https://www.oficinadanet.com.br/rss">RSS</a></li>
            </ul>
        </div>
        <div class="box-m3"  >
            <p class="wifl txt1">Um site do grupo</p>
            <a class="m3midia" href="http://www.m3midia.com.br"></a>
            <p class="wifl txt2">© 2017 <span>M3 Mídia</span></p>
            <p class="wifl txt2">Todos os direitos reservados</p>
        </div>
    </div>
</footer>
            <span title="Ir para o topo" class="top_page" id="top_page" ><span></span></span>
        <div class="wifl hgt100 blackoverlay" id="blackoverlay"></div>
<div style="display:none" id="flgcomment"></div>
<div id="out_lib" >
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
</div>
<script type="text/javascript">
    
    var vv={_keyStr:"ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=",encode:function(e){var t="";var n,r,i,s,o,u,a;var f=0;e=vv._utf8_encode(e);while(f<e.length){n=e.charCodeAt(f++);r=e.charCodeAt(f++);i=e.charCodeAt(f++);s=n>>2;o=(n&3)<<4|r>>4;u=(r&15)<<2|i>>6;a=i&63;if(isNaN(r)){u=a=64}else if(isNaN(i)){a=64}t=t+this._keyStr.charAt(s)+this._keyStr.charAt(o)+this._keyStr.charAt(u)+this._keyStr.charAt(a)}return t},decode:function(e){var t="";var n,r,i;var s,o,u,a;var f=0;e=e.replace(/[^A-Za-z0-9\+\/\=]/g,"");while(f<e.length){s=this._keyStr.indexOf(e.charAt(f++));o=this._keyStr.indexOf(e.charAt(f++));u=this._keyStr.indexOf(e.charAt(f++));a=this._keyStr.indexOf(e.charAt(f++));n=s<<2|o>>4;r=(o&15)<<4|u>>2;i=(u&3)<<6|a;t=t+String.fromCharCode(n);if(u!=64){t=t+String.fromCharCode(r)}if(a!=64){t=t+String.fromCharCode(i)}}t=vv._utf8_decode(t);return t},_utf8_encode:function(e){e=e.replace(/\r\n/g,"\n");var t="";for(var n=0;n<e.length;n++){var r=e.charCodeAt(n);if(r<128){t+=String.fromCharCode(r)}else if(r>127&&r<2048){t+=String.fromCharCode(r>>6|192);t+=String.fromCharCode(r&63|128)}else{t+=String.fromCharCode(r>>12|224);t+=String.fromCharCode(r>>6&63|128);t+=String.fromCharCode(r&63|128)}}return t},_utf8_decode:function(e){var t="";var n=0;var r=c1=c2=0;while(n<e.length){r=e.charCodeAt(n);if(r<128){t+=String.fromCharCode(r);n++}else if(r>191&&r<224){c2=e.charCodeAt(n+1);t+=String.fromCharCode((r&31)<<6|c2&63);n+=2}else{c2=e.charCodeAt(n+1);c3=e.charCodeAt(n+2);t+=String.fromCharCode((r&15)<<12|(c2&63)<<6|c3&63);n+=3}}return t}}
    function BV(str){return vv.decode(str);}

    function scrollPageToID(id)
    {
        $('html,body').animate({ scrollTop: $('#'+id).offset().top - ( $(window).height() - $('#'+id).outerHeight(true) ) / 2  }, 700);
    }

    function serializeDataAttr(form)
    {
        var dataarr = new Array();
        for(var i in form.data()) {
            var subarr = new Array();
            subarr['name'] = i;
            subarr['value'] = form.data()[i];
            dataarr.push(subarr);
        }
        return $.param(form.serializeArray().concat(dataarr));
    }

    function testaVazio(campo,comparacao,mensagem,erro)
    {
        if (erro == true) {return true;}
        if (document.getElementById(campo).value == comparacao)
        {
            alert (mensagem);
            document.getElementById(campo).value = "";
            document.getElementById(campo).focus();
            return true;
        }
        else {return false;}
    }
    function testaCheckBox(classe,mensagem)
    {
        erro = true;
        checkboxes = document.getElementsByClassName(classe);

        for(var i=0, n=checkboxes.length; i<n; i++)
        {
            if(checkboxes[i].checked)
                erro = false;
        }

        if(erro == true)
        {
            alert(mensagem);
            checkboxes[0].focus();
            return true;
        }
        else
            return false;
  }
    function ajaxDireto(url,param,retorno,tipo) //usa jquery
    {
        if(!tipo) tipo = "POST"
         $.ajax({
           type: tipo,
           url: url,
           data: param,
           success: function(html){
             $("#"+retorno).html(html);
           }
         });

    }
    function populaSelectCidade(ele)
    {
        ajaxDireto('https://www.oficinadanet.com.br/ajax_oficina.php','act=populaSelectCidade&sigla='+$(ele).val(),'select_cidade');
    }

     $(document).ready(function (e) {
        var header_height = $("header").height();
        $(window).scroll(function(){
            var scrolltop = $(window).scrollTop();
            if(scrolltop > 0)
                $('#out-img-curso-aberto').css('top',(($(window).scrollTop()/2) *-1) + header_height);
            else
                $('#out-img-curso-aberto').css('top',header_height+'px');
        });
    });

    var scroll_aux      = 0;
    var header_top      = $("#header").offset().top;
    var header_height   = $("#header").outerHeight();
    var window_height   = $(window).height();
    var height_document = $(document).height();

    function fixedMenu()
    {
        var scroll = $(window).scrollTop();

        if( scroll >= (header_top+header_height) )
        {
            if(scroll < scroll_aux )
            {
                $('#mov_header').css({'position':'fixed',transition: '0.3s','top':'0px'});
            }
            else
            {
                if( (scroll+window_height+20) > height_document )
                {
                    $('#mov_header').css({'position':'fixed',transition: '0.3s','top':'0px'});
                }
                else
                {
                    var v_tra  = '0.3s';
                    if( scroll <= ( header_top + header_height + 100) )
                        v_tra  = '0s';

                    $('#mov_header').css({'position':'fixed',transition: v_tra,'top':'-'+header_height+'px'});
                }
            }
        }
        else if(scroll <= header_top)
        {
            $('#mov_header').css({'position':'absolute',transition: '0.3s','top':'0px'});

        }
        scroll_aux = scroll;
    }

    function boxHoverSite(act,cic,e)
    {
        var top     = $(e).offset().top+$(e).outerHeight();
        var e_hover = '';

        if($(e).data('box-hover'))
        {
            e_hover = '#'+$(e).data('box-hover')+'_hover';

            switch(act)
            {
                case 2:
                    $('.contr_hov_itens').fadeOut(0);
                    $(e_hover).fadeIn(400);
                    $(e_hover).addClass('contr_hov_itens');
                    boxHoverSite(0,0,e);
                break;
                case 0:
                    if(cic < 5)
                    {
                        var timeBoxHoverSite = setTimeout(function()
                        {
                            cic++;
                            boxHoverSite(0,cic,e);
                        }, 500);
                    }
                    else
                    {
                        clearTimeout(timeBoxHoverSite);
                        if(!$(e_hover).is(":hover") && !$(e).is(":hover") && !$(e_hover+' *').is(":focus"))
                        {
                            $(e_hover).fadeOut(400);
                        }
                        else
                            boxHoverSite(0,0,e);
                    }

                break;
            }
        }
        else
        {
            $('.contr_hov_itens').fadeOut(0);
        }
    }

    function blackoverlay(act)
    {
        if(act)
        {
            $('#blackoverlay').fadeIn(400);
            $('html').addClass('no_scroll');
        }
        else
        {
            $('#blackoverlay').fadeOut(400);
            $('html').removeClass('no_scroll');
        }
    }

    function actAovivo()
    {
        window.location = "";
    }

    function actBodyPago()
    {
        window.open("");
    }

        
    function actSininho()
    {
        _gaq.push(['_trackEvent', 'sininho', 'sininho', 'sininho']);
        ajaxDireto('https://www.oficinadanet.com.br/ajax_oficina.php','act=setCookie&nome=ONSININHO&valor=1&tempo=36000','box_sininho');
        setTimeout("document.location = 'https://www.oficinadanet.com.br/novidades'",1000);
    }

    function actMenuMobile(act)
    {
        if(act)
        {
            $('#blackoverlay').addClass('blackoverlay_mobile').trigger('classChange');

            if(!$('#menumobile-act').data('post-left'))
            {
                $('#menumobile-act').data('post-left',$('#menumobile-act').css('left'));
            }
            $('#menumobile-act').css('left','0');
            $('#menumobile').css('display','none');
            $('#fechar_menumobile').css('display','block');
        }
        else
        {
            $('#menumobile-act').css('left',$('#menumobile-act').data('post-left'));
            $('#blackoverlay').removeClass('blackoverlay_mobile').trigger('classChange');
            $('#menumobile').css('display','block');
            $('#fechar_menumobile').css('display','none');
        }
        blackoverlay(act);
    }

    function actPopup(act,tipo)
    {
        if(act == 'fechar')
        {
            ajaxDireto('https://www.oficinadanet.com.br/ajax_oficina.php','act=setCookie&nome='+tipo+'&valor=1','box_popup');
            $('#box_popup').css('display','none');
            $('#box_popup_big').css('display','none');
            blackoverlay();
        }
    }

    function actSmartMobile(act)
    {
        if(act)
        {
            $('#blackoverlay').addClass('blackoverlay_smart').trigger('classChange');

            if(!$('#smart_filtro_m-act').data('post-left'))
            {
                $('#smart_filtro_m-act').data('post-left',$('#smart_filtro_m-act').css('left'));
            }
            $('#smart_filtro_m-act').css('left','0');
            $('#smart_filtro_m_abre').css('display','none');
            $('#smart_filtro_m_fecha').css('display','block');
            $('#smart_filtro_ud_out').css('display','block');
        }
        else
        {
            $('#smart_filtro_m-act').css('left',$('#smart_filtro_m-act').data('post-left'));
            $('#blackoverlay').removeClass('blackoverlay_smart').trigger('classChange');
            $('#smart_filtro_m_abre').css('display','block');
            $('#smart_filtro_m_fecha').css('display','none');
            $('#smart_filtro_ud_out').css('display','none');
        }
        blackoverlay(act);
    }

    var scroll_aux2     = 0;
    var window_width    = $(window).width();

    function fixedOnScroll(id)
    {
        if ($('#' + id).length > 0)
        {
            if( window_width > 1300 )
            {

                var k_distance      = 10;
                var comp_height     = 0;
                var scroll_top      = $(window).scrollTop();
                var height_maior    = false;
                var bottom_pause    = height_document;

                var anchor_top_dist     = $('#' + id).offset().top;
                var item_movel_height   = $('#' + id + ' > *').height();

                if ($('#' + id).data('distance'))
                {
                    k_distance = $('#' + id).data('distance');
                }


                if( item_movel_height+k_distance > window_height )
                {
                    height_maior    = true;
                    comp_height     = (item_movel_height - window_height );
                }

                if($( ".bottom_pause_post_barra" ).length)
                {
                    bottom_pause =  $( ".bottom_pause_post_barra" ).offset().top - ( item_movel_height + parseInt($( ".bottom_pause_post_barra" ).css('margin-top')) +k_distance);
                }

                if( bottom_pause  < scroll_top && !height_maior  )
                {
                    $('#' + id + ' > *').css({
                        "z-index": "100",
                        "left": '0px',
                        "position": "absolute",
                        "bottom": "initial",
                        "top": ( ( bottom_pause ) - anchor_top_dist )+'px'
                    });
                    //console.log('1 '+( ( bottom_pause ) - anchor_top_dist ));
                }
                else if( ( bottom_pause + k_distance )  < ( scroll_top - comp_height  ) && height_maior  )
                {
                    $('#' + id + ' > *').css({
                        "z-index": "100",
                        "left": '0px',
                        "position": "absolute",
                        "bottom": "initial",
                        "top": ( ( bottom_pause ) - anchor_top_dist  )+'px'
                    });
                    //console.log('2 '+( ( bottom_pause ) - anchor_top_dist ));
                }
                else if (( (scroll_top - k_distance) - comp_height ) > anchor_top_dist && height_maior)
                {
                    $('#' + id + ' > *').css({
                        "z-index": "100",
                        "left": $('#' + id + ' > *').offset().left + 'px',
                        "position": "fixed",
                        "bottom": k_distance + 'px',
                        "top": "initial"
                    });
                    //console.log('3 '+( ( bottom_pause ) - anchor_top_dist ));
                }
                else if (( (scroll_top + k_distance) - comp_height ) > anchor_top_dist && !height_maior)
                {
                    if(scroll_aux2>scroll_aux)
                    {
                        k_distance = k_distance + header_height;
                        //console.log('4 '+scroll_aux2+' '+scroll_aux);
                    }
                    $('#' + id + ' > *').css({
                        "z-index": "100",
                        "left": $('#' + id + ' > *').offset().left + 'px',
                        "position": "fixed",
                        "top": k_distance+'px',
                        "bottom": "initial"
                    });
                    //console.log('4 '+( ( bottom_pause ) - anchor_top_dist ));
                }
                else
                {
                    $('#' + id + ' > *').css({
                        "z-index": "initial",
                        "left": 'initial',
                        "position": "initial",
                        "bottom": 'initial',
                        "top": 'initial'
                    });
                    //console.log('5 '+( ( bottom_pause ) - anchor_top_dist ));
                }
            }
            scroll_aux2 = scroll_top;
        }
    }

    function atcFixedOnScroll()
    {
        fixedOnScroll('out_post_barra');
    }

    function actContatoEmpresa(act,tipo)
    {
        if(act && tipo != 0)
        {

            if(tipo == 1)
                $('#empresa_contato_titulo').html('Entre em contato');
            else
                $('#empresa_contato_titulo').html('Solicite um orçamento');

            $('#hidden_tipo').val(tipo);

            $('#blackoverlay').addClass('blackoverlay_cont_empresa').trigger('classChange');
            $('#empresa_contato').fadeIn(400);
            $('#empresa_contato').height($('#empresa_contato'+' > *').outerHeight());
        }
        else
        {
            $('#empresa_contato').fadeOut(400);
            $('#blackoverlay').removeClass('blackoverlay_cont_empresa').trigger('classChange');
            $('#empresa_contato_titulo').html('');
        }
        blackoverlay(act);
    }

    function actCorrigirTexto(act,e)
    {
        if($('#modal_corrigir_txt').length == 0)
        {
            $(e).data('corrigir_titulo');
            $("html").append('<div class="modal modal-s block corrigir" id="modal_corrigir_txt" ><span class="load-ico" ></span></div>');
            ajaxDireto('https://www.oficinadanet.com.br/ajax_oficina.php','act=corrigirTexto&monta=1&corrigir_titulo='+$(e).data('corrigir_titulo')+'¶_email='+$(e).data('para_email'),'modal_corrigir_txt');
        }


        if(act)
        {
            $('#blackoverlay').addClass('blackoverlay_corrigir').trigger('classChange');
            $('#modal_corrigir_txt').fadeIn(400);
        }
        else
        {
            $('#modal_corrigir_txt').fadeOut(400);
            $('#blackoverlay').removeClass('blackoverlay_corrigir').trigger('classChange');
        }
        blackoverlay(act);
    }

    $(document).ready(function()
    {
        
//        $(function () {
//            $(window).scroll(atcFixedOnScroll);
//        });

        $('.box_hover').mouseenter(function()
        {
            boxHoverSite(2,0,this);
        });

        $(window).scroll(fixedMenu);
        fixedMenu();

        $('#bt_header_busca').click(function(){ $('#busca_input').focus();});
        $('#smart_filtro_ud_dwn').click(function(){$(".smart_filtro").animate({scrollTop: '+=200px'}, 300);});
        $('#smart_filtro_ud_up').click(function(){$(".smart_filtro").animate({scrollTop: '-=200px'}, 300);});
        $('#mobile_busca').click(function(){ $('#mobile_bf').css('display','block');});
        $('#aovivo').click(function(){ actAovivo(); });
        $('#sininho').click(function(){ actSininho(true); });
        $('#smart_filtro_m_abre').click(function(){ actSmartMobile(true); });
        $('#smart_filtro_m_fecha').click(function(){ actSmartMobile(false); });
        $('#menumobile').click(function(){ actMenuMobile(true); });
        $('#fechar_menumobile').click(function(){ actMenuMobile(false); });
        $('#fechar_newsletter_big').click(function(){ actPopup('fechar','ONNEWSBIG'); });
        $('#fechar_newsletter').click(function(){ actPopup('fechar','ONNEWS'); });
        $('#fechar_youtube').click(function(){ actPopup('fechar','ONYOUTUBE'); });
        $('#popup_youtube').click(function(){ actPopup('fechar','ONYOUTUBE'); });
        $('#fechar_sininho').click(function(){ actSininho(false); });
        $("#form_envia").click(function(){ submitFormulario(); });
        $("#mostra_fone").click(function(){ $('#empresa_fone').html(BV($('#empresa_fone').data('info'))); $('#mostra_fone').hide(); });
        $(".empresa_contato").click(function(){ actContatoEmpresa(true,$(this).data('tipo'));});
        $('#empresa_contato_fechar').click(function(){ actContatoEmpresa(false,0) });
        $('.act_corrigir_texto').click(function(){ actCorrigirTexto(true,this) });
        $('.bt1-comment').click(function(){ scrollPageToID('comment') });
        $('#btcarregarcomments').click(function(){ carregaComentarios() });

        $('#blackoverlay').on('classChange',function(){
            $('.blackoverlay_sininho').click(function(){ actSininho(false) });
            $('.blackoverlay_mobile').click(function(){ actMenuMobile(false) });
            $('.blackoverlay_smart').click(function(){ actSmartMobile(false) });
            $('.blackoverlay_cont_empresa').click(function(){ actContatoEmpresa(false,0) });
            $('.blackoverlay_corrigir').click(function(){ actCorrigirTexto(false,'') });
        });


        $('.accordion_act1 .i-tit').click(function(e)
        {
            if($(this).prop("tagName") != 'A')
            {
                $(this).addClass('click');
                $('.li-wrapper:not(\'.click\')').animate({height:0}, { duration: 400, queue: false });
                $('.i-tit:not(\'.click\')').removeClass('ativo');

                if(!$(this).hasClass('ativo'))
                {
                    $(this).addClass('ativo');
                    $(this).find('+ .li-wrapper').animate({height:$(this).find('+ .li-wrapper > .accordion_act1').outerHeight()}, { duration: 400, queue: false });
                }
                else
                {
                    $(this).removeClass('ativo');
                    $(this).find('+ .li-wrapper').animate({height:0},400);
                }
                $(this).removeClass('click');
            }
        });


        if($('#tem_enquete').length > 0)
        {
            ajaxDireto('https://www.oficinadanet.com.br/ajax_oficina.php','act=getEnquete&enquete_id='+$('#tem_enquete').data("id"),'tem_enquete');
        }

        $('.accordion_act2 .tit_1').click(function(e)
        {
            $(this).addClass('click');
            $('.li-wp1:not(\'.click\')').animate({height:0}, { duration: 400, queue: false });

            if(!$(this).hasClass('ativo'))
            {
                var wrapper1_id         = 'wrapper_'+$(this).data('wrap0');
                var wrapper1_height     = $('#'+wrapper1_id+' > .accordion_act2 > li').length* $('#'+wrapper1_id+' > .accordion_act2 > li').outerHeight();

                $('#'+wrapper1_id).animate({height:wrapper1_height}, { duration: 400, queue: false });
                $('.tit_1').removeClass('ativo');
                $(this).addClass('ativo');
            }
            else
            {
                $('.tit_1').removeClass('ativo');
            }
            $(this).removeClass('click');
        });

        $('.accordion_act2 .tit_2').click(function(e)
        {
            $(this).addClass('click');
            $('.li-wp2:not(\'.click\')').animate({height:0}, { duration: 400, queue: false });

            var wrapper1_id = 'wrapper_'+$(this).data('wrap0');
            var wrapper2_id = 'wrapper_'+$(this).data('wrap0')+'_'+$(this).data('wrap1');

            if(!$(this).hasClass('ativo'))
            {
                var wrapper1_height     = $('#'+wrapper1_id+' > .accordion_act2 > li').length* $('#'+wrapper1_id+' > .accordion_act2 > li').outerHeight();
                var wrapper2_height     = $('#'+wrapper2_id+' > .accordion_act2 > li').length* $('#'+wrapper2_id+' > .accordion_act2 > li').outerHeight();


                $('#'+wrapper1_id).animate({height:wrapper1_height+wrapper2_height}, { duration: 400, queue: false });
                $('#'+wrapper2_id).animate({height:wrapper2_height}, { duration: 400, queue: false });

                $('.tit_2').removeClass('ativo');
                $(this).addClass('ativo');
            }
            else
            {
                var wrapper1_height = $('#'+wrapper1_id+' > .accordion_act2 > li').length*$('#'+wrapper1_id+' > .accordion_act2 > li > .tit_2').outerHeight();

                $('#'+wrapper1_id).animate({height:wrapper1_height}, { duration: 400, queue: false });
                $('.tit_2').removeClass('ativo');
            }
            $(this).removeClass('click');
        });
    });

    var lst_carregamento        = 1;
    var txtstatus               = 'ok';
    var html_ico_load_auto_load = '<span id="icoload_autoload" class="wifl p-rel" ><span class="load-ico" ></span></span>';
    function carregaConteudo()
    {
        if($('#auto_load_wrapper').length > 0)
        {
            var scrollPosition      = window.pageYOffset;
            var windowSize          = window.innerHeight;
            var footerHeightTop     = $('#footer').offset().top;

            var stop_load           = document.getElementById('auto_load_wrapper').getAttribute('data-stop-load');

            if((scrollPosition + windowSize + 800) > footerHeightTop && stop_load == '0')
            {
                if(txtstatus == 'ok')
                {
                    $("#auto_load_wrapper").append(html_ico_load_auto_load);
                    txtstatus = 'timeout';
                    $.ajax({
                        type: 'POST',
                        url: 'https://www.oficinadanet.com.br/ajax_oficina.php',
                        data: 'act=autoLoadConteudo&lst_carregamento='+lst_carregamento+'&'+serializeDataAttr($('#auto_load_wrapper')),
                        success: function(html)
                        {
                            $("#auto_load_wrapper").append(html);
                            $("#icoload_autoload").remove();
                            txtstatus = 'ok';
                        }
                    });
                    lst_carregamento++;
                }
            }
        }
    }

    $(function () {
        $(window).scroll(carregaConteudo);
        carregaConteudo();
    });

    $(window).scroll(function() {
        if ($(this).scrollTop() >= 150) {
            $('#top_page').fadeIn(200);
        } else {
            $('#top_page').fadeOut(200);
        }
    });
    $('#top_page').click(function() {
        $('body,html').animate({
            scrollTop : 0
        }, 500);
    });
</script>

            <script type="text/javascript">
                var disqus_shortname = 'oficinadanet'; // required: replace example with your forum shortname
                var disqus_url = 'https://www.oficinadanet.com.br/artigo/javascript/localizacao-de-endereco-atraves-do-cep-usando-jquery';

                var disqus_config = function () {
                    this.callbacks.onNewComment = [function(comment) {ajaxDireto('https://www.oficinadanet.com.br/ajax_oficina.php','act=flgcomment&id=2979','flgcomment');
                    }];
                };
                (function() {
                    var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
                    dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';
                    (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
                })();
            </script>
            <div style="display:none;" id="flgcomment"></div>
        
<script src="https://cdn.onesignal.com/sdks/OneSignalSDK.js" async></script>
<script>
var OneSignal = OneSignal || [];
OneSignal.push( function() {
    OneSignal.setDefaultTitle("Oficina da Net");
    OneSignal.setDefaultNotificationUrl("https://www.oficinadanet.com.br");
    var oneSignal_options = {appId: "c28261c1-6765-4517-bc5f-38bbeb9f2ec3"};
    //oneSignal_options['persistNotification'] = false;
    oneSignal_options['autoRegister'] = true;
    oneSignal_options['welcomeNotification'] = { };
    oneSignal_options['welcomeNotification']['title'] = "Oi. Obrigado pela inscrição =)";
    oneSignal_options['welcomeNotification']['message'] = "As melhores novidades avisaremos por aqui ;) - Siga @oficinadanet";
    oneSignal_options['safari_web_id'] = "web.onesignal.auto.2068edc0-2ec7-4d8d-bc37-83913e3acbff";
    OneSignal.init(oneSignal_options);
});
</script>
        <div id="box_popup_big" class="box_news_big newsletter">
            <div class="act fechar_box_popup box_hover p-rel" id="fechar_newsletter_big"></div>
            <div class="bb_left">
                <div class="logo5"></div>
            </div>
            <div class="bb_right">
                <span class="wifl">ASSINE NOSSA NEWSLETTER</span>
                <p class="wifl">As melhores publicações no<br>seu e-mail</p>
                <div class="wifl">
                    <form action="https://www.oficinadanet.com.br/ajax_oficina.php" onsubmit="ajaxDireto('https://www.oficinadanet.com.br/ajax_oficina.php','act=setCookie&nome=ONNEWSBIG&valor=1','box_popup_big'); return true;" method="post" >
                                            <input type="hidden" value="cadNewsletter" name="act"/>
                        <input type="hidden" value="1" name="newsletter"/>
                        <input class="form_campo2 round3p" type="text" name="nome" id="nome" placeholder="Seu nome" >
                        <input class="form_campo2 round3p" type="email" name="email" id="newsemail" placeholder="Seu e-mail" >
                        <input class="wifl bt1 bg4" type="submit" value="QUERO ME CADASTRAR">
                    </form>
                </div>
            </div>
        </div>
        <script type="text/javascript">setTimeout('abreBoxBigOficina();','30000');</script>
            <script type="text/javascript">
        function abreBoxBigOficina()
        {
            $('#box_popup_big').css('display','block');
            blackoverlay(1);
        } 
    </script>
            <script type="text/javascript">
            setTimeout("$('#box_sininho').fadeIn(1000)",1000);
        </script>
            <script type="text/javascript">
        if ($(".conteudo_galeria")[0])
        {
            $('#out_lib').append('<link href="https://painel.m3midia.com.br/lib/lightGallerySlider/lightGallerySlider.css" rel="stylesheet">');
            $.getScript("https://painel.m3midia.com.br/lib/lightGallerySlider/lightGallerySlider.js", function(){
                $('.conteudo_galeria').lightSlider({
               item: 3,
               loop:false,
               slideMove:3,
               easing: 'cubic-bezier(0.25, 0, 0.25, 1)',
               speed:600,
               responsive : [
                   {
                       breakpoint:800,
                       settings: {
                           item:3,
                           slideMove:1,
                           slideMargin:6,
                         }
                   },
                   {
                       breakpoint:480,
                       settings: {
                           item:2,
                           slideMove:1
                         }
                   }
               ]
                }).lightGallery({

                });
                $('.out_conteudo_galeria').css('display','block');
            });
        }


        (function ($) {
            $.fn.tweetHighlighted = function(options) {
                var settings = {}, classes;
                options = options || {};
                settings.node = options.node || '<button type="button">Tweet</button>';
                settings.cssClass = options.cssClass || 'tweet-me';
                settings.minLength = options.minLength || 1;
                settings.maxLength = options.maxLength || 144 * 4;
                settings.extra = options.extra || '';
                settings.via = options.via || null;
                settings.popupArgs = options.popArgs || 'width=400,height=400,toolbar=0,location=0';
                settings.callback = options.callback || null;
                classes = settings.cssClass.split(' ').filter(function(item) {return item.length;});
                settings._selector = '.' + classes.join('.');

                var onTextSelect = function(selector, callback) {
                    function getSelectedText() {
                      if (window.getSelection) {
                            return window.getSelection().toString();
                      } else if (document.selection) {
                        return document.selection.createRange().text;
                      }
                      return '';
                    };
                    $(selector).mouseup(function(e) {
                      var text = getSelectedText();
                      if (text !== '') {
                        callback(e, text);
                      }
                    });
                    $(document).click(function(e) {
                      var text = getSelectedText();
                      if (text !== '') {
                        e.stopPropagation();
                      }
                      else
                        $(settings._selector).fadeOut(500).remove();
                    });
                };

                var getTweetURL = function(text, extra, via) {
                    var url = 'https://twitter.com/intent/tweet?url=http://www.oficinadanet.com.br/artigo/javascript/localizacao-de-endereco-atraves-do-cep-usando-jquery&via=oficinadanet&text=';
                    url += encodeURIComponent(text);
                   if (extra)
                        url += encodeURIComponent(' ' + extra);
                    if (via)
                        url += '&via=' + via;
                    return url;
                };

                onTextSelect(this, function(e, text) {
                    var btnExists = $(settings._selector).length, url;

                    if (btnExists || text.length > settings.maxLength
                        || text.length < settings.minLength)
                    return;

                    url = getTweetURL(text, settings.extra, settings.via);
                    $(settings.node).addClass(settings.cssClass
                     ).offset({top: e.pageY,
                               left: e.pageX}
                     ).css({position: 'absolute',
                            cursor: 'pointer'}
                     ).appendTo('body'
                     ).fadeIn(500
                     ).click(function(e) {
                         $(settings._selector).fadeOut(500).remove();
                         window.open(url, '_blank', settings.popupArgs);
                         if( settings.callback != null ){
                           settings.callback(text);
                         }
                     });
                });
            };
        })(jQuery);

        $(function() {
            $('.conteudo').tweetHighlighted({
                node: '<span>Compartilhe no Twitter</span>',
                cssClass: 'bt1-twitter bg8 btn btn-primary',
                minLength: 2,
                maxLength: 2000 * 2,
                via: 'twitterhandle',
                popupArgs: 'width=600,height=400,toolbar=0,location=0'
            });
          });
    </script>
    
    </body>
</html>