Pesquisar na Comunidade

Save! Estou desenvolvendo um sistema e resolvi colocar um parte para o "esqueci minha senha" para os usuários recuperarem e não precisarem refazer um cadastro o problema é que eu não consigo obter exito. Usei o PHPMailes mas ele não funciona Gostaria de saber se vocês conhecem algum artigo, livro ou vídeo-aula que explica como fazer isso por que as pesquisas que eu fiz na net não me retornaram resultados esperados. Desde já agradeço

<select name="pizzas" id="select-pizzas"> <option value=""></option> <option value="11">pizza1</option> <option value="12">pizza2</option> <option value="13">pizza3</option> <option value="14">pizza4</option> </select> <input type="pizzas" name="pizzas" id="input-pizzas" readonly="readonly" value=""> <script type="text/javascript"> var $select = document.getElementById('select-pizzas'), $input = document.getElementById('input-pizzas'); $select.addEventListener('change', function(){ $input.value = this.value === '11' ? '10,00' : '20,00' ; }); </script> tenho esse codigo acima e gostaria de saber como posso da continuidade nele no sentido que ao selecionar pizza1 mostra no input o valor de 10,00 pizza 2 me mostra o valor de 20,00 , eu pequei esse godigo aqui msm com o William Bruno mais n sei como fazer pra mostrar o retante dos valores , essa parte que me mata kk, $input.value = this.value === '11' ? '10,00' : '20,00' ;

Boa noite amigos, estou com um problema em um script, ele funciona desta forma: <script> function validate(){ var i = 0, counter = 0, testeCB; testeCB = document.forms[0].testeCB; for (; i < testeCB.length; i++) { if (testeCB[i].checked) { counter++; } } if (counter==0){ alert("Você precisa selecionar pelo menos um") return false; } return true; } </script> <input type="checkbox"id="cb1" name="testeCB" value="1"> <input type="checkbox"id="cb2" name="testeCB" value="2"> mas quando eu substituo o name para name="testeCB[]" para conseguir armazenar no BD, para de funcionar.... apos algumas pesquisas, o menlhor que consegui encotrar foi isto testeCB = document.forms[0].elements['testeCB[]']; substituir ali, mas mesmo assim nao funciona, alguem tem alguma solução??

Olá galera, tudo bom ? Estou com uma dúvida... Tenho uma função javascript em que faz algumas requisições de uma API... porem eu tenho q chamar essa api a cada 4 minutos! (caso o usuário tenha ativado). Tudo bem... essa função está em um arquivo chamado: Ativador.js E está configurada na index.php do meu site... (ao usuário apertar o botão ATIVAR, ele faz a requisição e com o SetInterval chama ela novamente a cada 4 minutos). Mas ai que vem minha dúvida... Ao usuário mudar de pagina, a função para e o usuário teria que apertar ATIVAR novamente... Gostaria de saber como fazer com que se o botão ativar for acionado e a função estivesse chamada (fazendo as requisições a cada 4 minutos) e o usuário mudasse de pagina isso continuaria... (Fazendo as requisições a cada 4 minutos) estilo o mini player do youtube.... POREM SE O USUÁRIO SAIR DO SITE E VOLTAR NOVAMENTE A FUNÇÃO ESTARIA DESATIVADA (O usuário teria que acionar o botão ativar novamente.,) Obrigado. Ficou meio confuso se não tiverem entendido posso explicar melhor! Só queria um norte pois não sei como iniciar, tentei fazer algo com o LocalStorage ... declarando que a função está ativada e etc... mas tive problemas!

Olá, pessoas, bom dia Estou tentando fazer um autoscroll de acordo com o conteúdo que tem na pagina. Atualmente estou fazendo assim: <script src="jquery.js"></script> <script> setInterval(function(){ $("html, body").animate({ scrollTop: $(document).height() }, 200000); },2000); </script> Desse jeito eu seu que uma pagina com 300 linhas irá demorar cerca de 1min e 30 segundos para chegar até o final. Mas se precisar mudar o tamanho da fonte ou inserir imagens já terei que calcular novamente o tempo, será que existe uma maneira de fazer isso pelo tamanho do conteúdo? Por exemplo para pessa pagina eu quero que demore cerca de 5 minutos para chegar até o rodape.. para outra pagina cerca de 3 minutos independente do conteudo?

Olá pessoal, tudo bem? Estou com uma dúvida bem bobinha... mas gostaria que me ajudassem a solucionar. Alguns sites utilizam uma forma de carregar as imagens deixando elas embaçadas/desfocadas. Até que são carregadas e elas aparecerem normalmente... Exemplo básico seria esse site: https://www.redbull.com/br-pt/athletes Sabem me explicar como isso é feito, e pra que ? Meu site usa bastante imagens, gostaria de saber se tem algum benefício ou se seria somente estética ... Obrigado! (Não sei se isso é feito em JavaScript, acredito que sim... perdão se publiquei na área errada).

Olá! Esotu com uma certa dificuldade em um projeto que estou desenvolvendo em relação a funcionalidade drag and drop com jQuery/JavaScript. <div class="pricipal-menu"> <div class="col-1"> <img src="imagem/1.png"> <img src="imagem/2.png"> <img src="imagem/3.png"> </div> <div class="col-2"> <img src="imagem/1.png"> <img src="imagem/2.png"> <img src="imagem/3.png"> </div> <div class="col-3"> <img src="imagem/1.png"> <img src="imagem/2.png"> <img src="imagem/3.png"> </div> <div class="col-4"> <img src="imagem/1.png"> <img src="imagem/2.png"> <img src="imagem/3.png"> </div> </div> Bom, o que quero fazer é, por exemplo, pegar a img1 da primeira coluna (1, 1) e passá-la para a coluna 2 na posição da img2 (2,2). Até ai tudo bem, o problema é , preciso que quando a img1 for colocada na posição (2,2) a img2 que está na vá para (1,1). Exatamente como um $(...).sortable(), aliás, já tentei até mesmo com o connectWith do sortable(), mas não adianntou muito. Mais resumidamente, é fazer com que as imagens invertam a posição entre as colunas, mas não sei como. OBS: já tentei, inclusíve, colocá-las em variáveis pra depois assumirem as posições com o drag'n drop, mas cheguei no mesmo resultado do connectWith. Agradeço a atenção!

Tenho um formulário <form role="form" name="senha" class="ls-login-form" action="#"> <fieldset> <label class="ls-label col-md-16"> <b class="ls-label-text">CPF:</b> <input type="text" name="cpf" id="cpf" class="ls-mask-cpf" placeholder="000.000.000-00" required> <span id="errocpf" class="ls-sm-space"></span> </label> <label class="ls-label col-md-16"> <b class="ls-label-text">E-mail:</b> <input type="text" name="email" placeholder="Digite seu email" maxlength="60" size="65" required> </label> <br> <input onclick="validacaoEmail(senha.email,senha.cpf)" id="botao" type="button" value="Redefinir" class="ls-btn-primary ls-btn-block ls-btn-lg"> --- e o JS ---- function validacaoEmail(field, field2) { usuario = field.value.substring(0, field.value.indexOf("@")); dominio = field.value.substring(field.value.indexOf("@") + 1, field.value.length); var cpf = field2.value; if ((usuario.length >= 1) && (dominio.length >= 3) && (usuario.search("@") == -1) && (dominio.search("@") == -1) && (usuario.search(" ") == -1) && (dominio.search(" ") == -1) && (dominio.search(".") != -1) && (dominio.indexOf(".") >= 1) && (dominio.lastIndexOf(".") < dominio.length - 1)) { if (cpf.length < 11) { document.getElementById("alerta-email").innerHTML = "<strong>Vish!</strong> CPF inválido."; } } else { if (cpf.length < 11) { document.getElementById("alerta-email").innerHTML = "<strong>Vish!</strong> E-mail e CPF inválidos"; } else { document.getElementById("alerta-email").innerHTML = "<strong>Vish!</strong> E-mail inválido. Os endereços de e-mail devem seguir o padrão xx@xx.xx. "; } } } $(document).ready(function () { var $seuCampoCpf = $("#cpf"); $seuCampoCpf.mask('000.000.000-00', {reverse: true}); }); Quero testar com onclick e depois enviar para o PHP adicionar no banco. Mas ele não chama a pagina. Com TYPE = Button ele funciona o testa da máscara e não redireciona. Com type = submit ele não funciona a mascara e redireciona. Provavelmente é algo bem simples , mas estou com uma bela duvida de como resolver. att

Olá gostaria de pedir ajuda pois estou começando a estudar Javascript... Meu problema é o seguinte, eu gostaria de fazer uma espécie de armazenamento de dados de uma tabela do Excel, só que com Javascript... Algo tipo: CAB=["Código";"Nome";"Cidade";"Idade";] L1=["A-0001";"João";"Florianópolis";"21";] L2=["A-0002";"Lucas";"Balneário Camboriú";"18";] ...que eu pudece puchar a informação via input semelhante à função PROCV do Excel. Exemplo ao digitar "A-0001" retornaria em divs específicas os seguintes valores: <html> <body> <input type="text" name="procurar"/> <input type="button" value="CARREGAR"/> <div id="codigo">Retornar aqui o código!</div> <div id="nome">Retornar aqui o nome!</div> <div id="cidade">Retornar aqui a cidade!</div> <div id="idade">Retornar aqui a idade!</div> </body> </html> Des de já, Grato! Estou começando então a parte javascript é só pra demonstrar, creio que esteja bem errada, mas é pra vocês ter ideia do que eu queria aprender!

Então pessoal. tenho um formulário de cadastro, quero que quando o usuário queira, sair da pagina aparecer um alert, por ae tudo bem eu conseguir, só que, minha dificuldade e remover essa função clica no botão de <script> window.addEventListener("beforeunload", function (event) { event.returnValue = "Você deseja realmente sair da página?"; }); <script> <a href='finalizar.php' onclick=''> finalizar</a> finalizar, assim ele sair da pagina de boa sem nenhuma alert

Olá pessoas, estou utilizando o Google Charts, e me venho a necessidade de usar imagem nos gráficos. Alguém já usou, e sabe como fazer?

Crie um código em JavaScript que receba 2 palavras, e depois as imprima intercaladas. Ex.: “Joao” e “Mary”; a impressão deve ser: “JMoaaroy”. Use uma função que receba as duas palavras, e faça a intercalação.

Olá preciso de ajuda com esse exercício. Montei até a parte de formulário + validação de javascrip no dreamweaver mas buguei com o resto. O que eu fiz: <html> <head> <title> Formulário CPF validado com Java Script </title> <script language="javascript" type="text/javascript"> function validar() { var cpf = form1.cpf.value; if (cpf == "") { alert('Preencha o campo com seu cpf'); form1.cpf.focus(); return false; } } </script> </head> <body> <form name="form1" action="enviar.php" method="post"> CPF: <input name="cpf" type="text"><br /><br /> <input type="submit" onclick="return validar()"> </form> </body> </html> EXERCÍCIO Criar um formulário simples em html com um único campo CPF; Fazer uma validação em javascript antes de fazer o post; Consumir o WS https://bi.vidaclass.com.br/utils para consultar informações do CPF enviado pelo form; Do retorno obtido exibir na tela: Nome, email, telefone Se tem compra em saude: Sim | Não Quantas compras: (5) ex. Se tem farma: Sim | Não Se tem dependente: Sim | Não Qtd. de dependentes: (2) ex. Obtem o token para consumir os endpoints; https://bi.vidaclass.com.br/auth { "company_id": 1, "username": "webmaster@vidaclass.com.br", "password": "Teste20170705" } Endpoint para consultar o CPF https://bi.vidaclass.com.br/utils { "action": 4, "key": { "cpf": 25383193820 } }

Olá preciso de ajuda com esse exercício. Montei até a parte de formulário + validação de javascrip no dreamweaver mas buguei com o resto. O que eu fiz: <html> <head> <title> Formulário CPF validado com Java Script </title> <script language="javascript" type="text/javascript"> function validar() { var cpf = form1.cpf.value; if (cpf == "") { alert('Preencha o campo com seu cpf'); form1.cpf.focus(); return false; } } </script> </head> <body> <form name="form1" action="enviar.php" method="post"> CPF: <input name="cpf" type="text"><br /><br /> <input type="submit" onclick="return validar()"> </form> </body> </html> EXERCÍCIO Criar um formulário simples em html com um único campo CPF; Fazer uma validação em javascript antes de fazer o post; Consumir o WS https://bi.vidaclass.com.br/utils para consultar informações do CPF enviado pelo form; Do retorno obtido exibir na tela: Nome, email, telefone Se tem compra em saude: Sim | Não Quantas compras: (5) ex. Se tem farma: Sim | Não Se tem dependente: Sim | Não Qtd. de dependentes: (2) ex. Obtem o token para consumir os endpoints; https://bi.vidaclass.com.br/auth { "company_id": 1, "username": "webmaster@vidaclass.com.br", "password": "Teste20170705" } Endpoint para consultar o CPF https://bi.vidaclass.com.br/utils { "action": 4, "key": { "cpf": 25383193820 } }

Estou criando um jogo de cartas em web, o jogo é bem estilo HS, e estou tendo problemas para adicionar condições de movimentação no drag and drop. Como vocês podem ver eu tenho uma variável mana, e a movimentação das cartas só seria possível de acordo com ela, porém quando adiciono as condições o D&D acaba nem se movimentando mais, pensei em chamar cada função do d&d dentro de uma condição, mas também não funcionou, alguém pode ajudar? JS // Jogador 1 const fillplace1 = document.querySelector('#fillplace1'); const fillplace2 = document.querySelector('#fillplace2'); const fillplace3 = document.querySelector('#fillplace3'); var fill; const empties = document.querySelectorAll('.empty'); fillplace1.addEventListener('dragstart', enterstart); fillplace2.addEventListener('dragstart', enterstart); fillplace3.addEventListener('dragstart', enterstart); for (const empty of empties) { empty.addEventListener('dragover', dragOver); empty.addEventListener('dragenter', dragEnter); empty.addEventListener('dragleave', dragLeave); empty.addEventListener('drop', dragDrop); } function enterstart(){ fill = this; } function dragOver(e) { e.preventDefault(); } function dragEnter(e) { e.preventDefault(); this.className += ' hovered'; } function dragLeave() { this.className = 'empty'; } function dragDrop(id) { this.className = 'empty'; this.append(fill); } HTML <link rel="stylesheet" href="../css/jogar.css" /> <div id="barraGeneral"> <img src="../imagens/Campo/barraGeneralalfa.png" id="imggeneral" /> </div> <div id="persona"> <img src="../imagens/Personagem/cucapersonagem.png" id="imgpersonagem" /> </div> <button id="btpassar" onclick="cont();">Passar Rodada</button> <H1 id="campomana">1</H1> <!-- Mesa das cartas jogador 1--> <div class="empty" id="emptyplace1"> </div> <div class="empty" id="emptyplace2"> </div> <div class="empty" id="emptyplace3"> </div> <div class="empty" id="emptyplace4"> </div> <div class="empty" id="emptyplace5"> </div> <!-- Mão do jogador 1 --> <div class="emptyhand1"> <div class="fill" draggable="true" id="fillplace1"> <img src='../imagens/Sorteio/aa.png' draggable='true'> </div> </div> <div class="emptyhand2"> <div class="fill" draggable="true" id="fillplace2"> <img src='../imagens/Sorteio/aa2.png' draggable='true'> </div> </div> <div class="emptyhand3"> <div class="fill" draggable="true" id="fillplace3"> <img src='../imagens/Sorteio/aa2.png' draggable='true'> </div> </div>

Boa tarde pessoal, Estou quebrando a cabeça para resolver um problema, tenho uma div dinâmica que carrega uma <table> em uma das colunas deveria apresentar o componente Switchery, esta <table> é montada a partir de uma função PHP que faz o select em uma tabela do banco de dados conforme abaixo: echo '<table class="table table-hover"> <thead> <tr> <th>Nome</th> <th>Agrupamento</th> <th>Ativo</th> </tr> </thead> <tbody>'; foreach($data as $row) { If ($row['ativo'] == 1) {$vativochk = "checked";} else {$vativochk = "";} echo '<tr> <td>'.$row['nome'].'</td> <td>'.$row['agrupamento'].'</td> <td><input type="checkbox" name="ativo_grid" class="js-switch" '.$vativochk.' disabled="disabled"></td> </tr>'; } echo ' </tbody> </table>'; Aqui está o Ajax que chama e retorna atualizando a DIV: //funcoes do grid dos graficos function atualiza_grid_graficos() { $.ajax({ type: "POST", url: "hubfuncind.php", data: { id_tabindicadores_paineis: $('#id_tabindicadores_paineis').val(), acao: "gridgraficos" }, success: function(data) { $('#conteudo').html(data); } }); } O retorno vem certinho, mas apenas o componente Switchery está vindo desconfigurado, ou seja vem um checkbox normal (html). O que é mais incrível é que neste mesmo formulário mais acima tenho este mesmo componente funcionando normalmente, somente dentro da DIV dinâmica é que fica desconfigurado conforme imagem anexa. Será que alguém já passou por isso?

Então pessoal, estou fazendo um pequeno projeto para me aperfeiçoar em javascript e acabei me deparando com o seguinte problema. Eu queria pegar o valor de um input quando o usuário desse um click em um botão e isso foi simples de fazer, porém ao utilizar conceitos de POO e aplicando classes no javascript não consigo fazer essa ação. Gostaria de saber se isso é possível? E como fazer? Segue o code HTML: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"/> <meta name="author" content="Dallas"> <meta http-equiv="refresh" content="1"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link href="../CSS/withdrawal.css" rel="stylesheet"> <script src="../javascript/withdrawal.js"></script> <title>Banco do Brasil</title> </head> <body> <h1>Quanto deseja sacar ?</h1> <input type="number" id="cashInReal"> <button type="button" onclick="alter()"> AQUI</button> </body> </html> code javascript: class withdrawal { alter() { alert(document.getElementById('cashInReal').value); } } Desde já muito obrigado. Att. Dallas

Boa tarde pessoal, Estou quebrando a cabeça para resolver um problema, tenho uma div dinâmica que carrega uma <table> em uma das colunas deveria apresentar o componente Switchery, esta <table> é montada a partir de uma função PHP que faz o select em uma tabela do banco de dados conforme abaixo: echo '<table class="table table-hover"> <thead> <tr> <th>Nome</th> <th>Agrupamento</th> <th>Ativo</th> </tr> </thead> <tbody>'; foreach($data as $row) { If ($row['ativo'] == 1) { $vativochk = "checked"; } else { $vativochk = ""; } echo '<tr> <td>'.$row['nome'].'</td> <td>'.$row['agrupamento'].'</td> <td><input type="checkbox" name="ativo_grid" class="js-switch" '.$vativochk.' disabled="disabled"></td> </tr>'; } echo '</tbody> </table>'; Aqui está o Ajax que chama e retorna atualizando a DIV: function atualiza_grid_graficos() { $.ajax({ type: "POST", url: "hubfuncind.php", data: { id_tabindicadores_paineis: $('#id_tabindicadores_paineis').val(), acao: "gridgraficos" }, success: function(data) { $('#conteudo').html(data); } }); } O retorno vem certinho, mas apenas o componente Switchery está vindo desconfigurado, ou seja vem um checkbox normal (html). O que é mais incrível é que neste mesmo formulário mais acima tenho este mesmo componente funcionando normalmente, somente dentro da DIV dinâmica é que fica desconfigurado conforme imagem anexa. Será que alguém já passou por isso?

Ola Boa noite, Longe de focar na pergunta de qual melhor linguagem. Cada um vai for em elogiar a sua. Então antes de iniciar queria definir algumas Li sobre muitas, e meu desenvolvimento Web porém quero foca muito maior em desenvolvimento mobile. Então vi sobre python, embora uma linguagem incrivel, vi muitos elogios, a parte mobile ainda e fraca. Temos o JAVA pelo que li, e a mais utilizada, também como todas tem seus pontos fracos, desenvolver pra Web pode ser tão caro quanto solução Microsoft). Temos o JavaScript (Cordova, phonegap, HTML5), dentre outras coisas. Temos o C# e poderia usar o xamarin, porém tem o fato de esta ligada a Microsoft e fazer com que os custos de uma aplicações fique cara. Então to naquele dilema, embora eu tenha amado o python, ele eu até esturia em conjunto, poderia até quem sabe pensar em fazer a parte web. Então digamos que esteja tentado a focar mesmo em C# ou JavaScript, com forte tendência a ir pelo lado de JavaScript, uma vez que qualquer que seja a linguagem eu não va fugir de ter que aprender ou conhecer um pouco de JavaScript, e o que li sobre NodeJS são como disse todas tem seus defeitos li muitas coisas boas, inclusive hoje boa parte das hospedagens, tem focado em trabalhar com NodeJS, mas nunca tive nenhum contato Com C# já tive algum contato embora breve e superficial. Eu até ia inciar o foco no C#, mas lendo, e lendo cheguei a essa duvida. Sei que java, e mais utilizada e tal, porém seila porque, não quero partir pro lado do java. Ai algupem me falou se eu for ter uma aplicação mais robusta, eu precisaria de uma linguagem que de opção de trabalhar de forma nativa com desenvolvimento mobile, fazendo referência que o JavaScrip com HTML5 poderia ser um problema. Levando em consideração todas variaveis, se fosse hoje pra escolher uma linguagem pra desenvolvimento web/mobile. Qual seria uma escolha ideal?

tenho um site que precisa que assim que eu aperte um botão ele verifiquei se a variavel sala for sala 1 ele abre no modal da sala1 se não abre no modal da sala2. Dei uma pesquisada e vi que da pra fazer com a função onclik(), mas não tenho noção como fazer. Aqui vai o código. botão <td><a href="#" class="btn btn-primary" data-toggle="modal" data-target="#modalLoginForm">XXX</a></td> <!-- sala 1 --> <div class="modal-body mx-3"> <div class="md-form mb-4"> <form method="POST" action="valida.php"> <h6>Sala 1</h6> <input type="password" class="form-control validate" name="senha"> </div> </div> <button type="submit" class="btn btn-primary" name="enviar">Entrar</button> </form> </div> </div> </div> </div> </div> <!-- sala 2 --> <div class="modal fade" id="modalLoginForm2" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> <div class="modal-dialog" role="document"> <div class="modal-content"> <div class="modal-header text-center"> <h4 class="modal-title w-100 font-weight-bold">Senha</h4> <button type="btn-primary" class="close" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true">&times;</span> </button> </div> <div class="modal-body mx-3"> <div class="md-form mb-4"> <form method="POST" action="valida.php"> <p>Sala 2</p> <input type="password" class="form-control validate" name="senha2"> </div> </div> <div class="modal-footer d-flex justify-content-center"> <button type="submit" class="btn btn-primary" name="enviar1">Entrar</button> </form> </div> </div> </div> </div>

Estou tentando calcular duas horas e as vezes precisso que ela saia negativa tbm Exemplo: 07:33 - 07:48 = -00:15 Como faço isso utilizando php ?

Meu site é :https://xraros.000webhostapp.com/ To com seguinte problema eu adicionei esse código: jQuery(document).ready(function() { if($(window).width()<=820) { $('#menu').hide(); } }); no arquivo carrega.js com a intenção de ocultar o menu só quando a tela estive com 820px de largurar ou menos, mais isso não esta acontecendo, como podem ver no meu site esse script n esta funcionando ele ta ocultando o menu em todas as resoluções, como faço pra deixar o menu oculto na resolução de 820px pra baixo?

Estou testando a configuracao do webpack em um projeto teste, mas estou tendo problemas com o import de outros arquivos js. Eu importo uma funcao, de um outro arquivo JS, pro meu arquivo principal, mas quando abro no navegador o html, ele acusa erro de sintaxe no arquivo JS export function multiplica(a,b){ return a*b; } import { multiplica } from './functions'; multiplica(1,3); o referido erro eh na chave de abertura logo apos o import. Mensagem do erro: Uncaught SyntaxError: Unexpected token {

Estou fazendo um requisição HTTP e de retorno recebo um Json! Então eu quero pegar esse valor de Json e atribuir a outra variável para poder modificá-la e depois exibir as duas lado a lado para comparar. Então me deparei com 2 problemas o primeiro é que não estou conseguindo atribuir o valor httpRequest.responseText a uma variável, já tentei a função eval() e a toString() e quando eu peço para printar com um alert() para verificar me retorna undefined o segundo problema é que eu estava exibindo o resultado na dom por meio de appendChild(), estou exibindo apenas com os valores originais para teste, mas quando ele executa esse trexo do code, ele printa na dom e logo em seguida retira da dom, tipo uma piscadinha rápida. Ficaria grato se me ajudassem a resolver esse problema. o Json que ele recebe de uma pagina .html é esse: {"numero_casas":9,"token":"68c56aa784fe216ae92720b76386ea0995055074","cifrado":"fqnw rw mxdkc, unjen rc xdc. sxbqdj kuxlq","decifrado":"","resumo_criptografico":""} o Script esta assim: var httpRequest function request(){ var url = 'test.html'//apagar depois if (window.XMLHttpRequest) { // Mozilla, Safari, ... httpRequest = new XMLHttpRequest() } else if (window.ActiveXObject) { // IE try { httpRequest = new ActiveXObject("Msxml2.XMLHTTP") } catch (e) { try { httpRequest = new ActiveXObject("Microsoft.XMLHTTP") } catch (e) {} } } if (!httpRequest) { alert('Giving up :( Cannot create an XMLHTTP instance') return false } httpRequest.onreadystatechange = alertContents httpRequest.open('GET', url, true) httpRequest.responseType = 'jason' httpRequest.send() httpRequest.onload = function(){ view(httpRequest) } } function alertContents() { if (httpRequest.readyState === 4) { if (httpRequest.status === 200) { alert(httpRequest.responseText) } else { alert('There was a problem with the request.') } } } function view(httpRequest){ var resposta = httpRequest.responseText.toString() alert(resposta.value) var box = document.querySelector('div#decoding') box.setAttribute('class', 'shadow') var challenge = document.createElement('fieldset') challenge.setAttribute('class', 'painting') var legendChallenge = document.createElement('legend') legendChallenge.innerHTML = 'Challenge' challenge.innerHTML = `Número de casas: ${httpRequest.response.numero_casa}<br> Token: ${httpRequest.response.token}<br> Cifrado: ${httpRequest.response.cifrado}<br> Decifrado: ${httpRequest.response.decifrado}<br> Resumo Criptografico: ${httpRequest.response.resumo_criptografico}` var answer = document.createElement('fieldset') answer.setAttribute('class', 'painting') var legendAnswer = document.createElement('legend') legendAnswer.innerHTML = 'Answer' answer.innerHTML = `Número de casas: ${httpRequest.response.numero_casas}<br> Token: ${httpRequest.response.token}<br> Cifrado: ${httpRequest.response.cifrado}<br> Decifrado: ${httpRequest.response.decifrado}<br> Resumo Criptografico: ${httpRequest.response.resumo_criptografico}` box.appendChild(challenge) box.appendChild(answer) challenge.appendChild(legendChallenge) answer.appendChild(legendAnswer) } Index.html: <!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"> <link rel="stylesheet" href="style.css"> <title>Caesar cipher</title> </head> <body> <header> <h1>Caesar cipher</h1> </header> <section> <div class="container"> <div class="box"> <div class="form"> <form action=""> <div> <fieldset class="shadow"> <legend><h1>Decoding</h1></legend> <button id="btntoken" onclick="request()">Fetch Encryption Challenge</button> </fieldset> </div> <div id="decoding" class="aling"></div> </form> </div> </div> </div> </section> <footer> </footer> <script type="text/javascript" src="script.js"></script> </body> </html> e o style.css para dar sentido as class: /*zerando margein e padding de todos os elementos*/ *{ margin: 0; padding: 0; } /*definido estilo padrão*/ body{ font-family: 'Courier New', Courier, monospace; font-size: 16px; background-color: #F5F6FA; } /*Estilização e alinhamento do cabeçario*/ header{ background-color: #22212F; color: #FFF; height: 80px; font-size: 24px; align-items: center; display: flex; padding-left: 15px; } /*Alinhamento das tags presentes na section*/ section,div.form{ display: flex; justify-content: center; } div.container{ margin:5px; width: 800px; background-color: #FFF; padding: 15px; margin-top: 20px; } div.parag,div.box{ display: block; } div.form{ margin-top:30px; } p{ margin-top: 10px; } /*estilização do formulario principal*/ .shadow{ box-shadow: 5px 5px 5px 2px #22212F; } fieldset{ width: 500px; min-height:150px; padding: 10px; } legend{ font-size: 20px; } input#token{ font-size: 16px; width: 350px; height: 30px; } button#btntoken{ margin: 5px; margin-top:15px; width:480px; height: 50px; font-size: 24px; } /*estilização da resposta ao usuário*/ .aling{ margin: 20px; } .painting{ display: inline-block; width: 230px; min-height: 100px; }

Tenho um codigo html com JavaScript com um dropDown para estado que exibe a cidade de acordo com esse estado e depois mostra um endereço, a cada seleção ele empurra a div que esta em baixo mais para baixo. <div class="fisico " > <select id="test" name="form_select" onchange="mostrarCidade(this)" style="width: 200px; text-align: center; text-align-last: center;"> <option value="0">Estados</option> <option value="1">Rio de Janeiro</option> <option value="2">Espirito Santo</option> <option value="3">Minas Gerais</option> </select> <div id="cidadeRio" style="display:none;" style="position:relative;" > <select id="rio" name="form_rio" onchange="mostrarEndereco(this)" style="width: 200px;text-align: center; text-align-last: center;" > <option value="0">Cidade</option> <option value="1">ITAPERUNA</option> <option value="2">CAMPOS DOS GOYTACAZES</option> <option value="3">RIO DAS OSTRAS</option> <option value="4">MACAÉ</option> <option value="5">SAQUAREMA</option> <option value="6">MARICA</option> <option value="7">ARARUAMA</option> <option value="8">CABO FRIO</option> <option value="9">RIO BONITO</option> <option value="10">SÃO PEDRO DA ALDEIA</option> <option value="11">NOVA FRIBURGO</option> <option value="12">PETROPOLIS</option> <option value="13">TERESOPOLIS</option> </select><br> <div class="ruasRio" style="width: 200px; text-align: center; text-align-last: center;"> <div id="itaperuna" style="display:none;" >AV CARDOSO MOREIRA nº325 - Centro</div> <div id="campos"style="display:none;">AV 7 DE SETEMBRO nº492 - Centro</div> <div id="ostras"style="display:none;">AV AMARAL PEIXOTO nº4472 - BALNEARIO REMANSO</div> <div id="macae"style="display:none;">AV RUI BARBOSA nº663 - Centro</div> <div id="saquarema"style="display:none;"> RUA PROF FRANCISCO FONSECA nº350 - Bacaxa</div> <div id="marica"style="display:none;"> PC CONSELHERO MACEDO SOARES nº168 - Centro</div> <div id="araruama"style="display:none;"> RUA MAJOR FELIX MOREIRA nº107 - Centro</div> <div id="cabo"style="display:none;"> RUA TEIXEIRA E SOUZA nº31 - Centro</div> <div id="bonito"style="display:none;">RUA XV DE NOVEMBRO nº104</div> <div id="pedro"style="display:none;">RUA DR ANTONIO ALVES nº208/218 - Centro</div> <div id="friburgo"style="display:none;">AV ALBERTO BRAUNE nº64 - Centro</div> <div id="petropolis"style="display:none;">RUA DO IMPERADOR nº751 - Centro</div> <div id="teresopolis"style="display:none;">AV DELFIM MOREIRA nº610 - Centro</div> </div> </div> <div id="cidadeEs" style="display:none;" style="position:relative;"> <select id="es" name="form_es" onchange="mostrarEndereco(this)" style="width: 200px; text-align: center; text-align-last: center; "> <option value="14">Cidade</option> <option value="15">VILA VELHA</option> <option value="16">VITORIA</option> <option value="17">SERRA</option> <option value="18">CARIACICA</option> <option value="19">CACHOEIRO DE ITAPEMIRIM</option> <option value="20">GUARAPARI</option> <option value="21">SÄO MATEUS</option> <option value="22">LINHARES</option> <option value="23">ARACRUZ</option> <option value="24">COLATINA</option> <option value="25">GUACUI</option> </select><br> <div class="ruasEs" style="width: 200px; text-align: center; text-align-last: center;"> <div id="velha" style="display:none;">AV JERONIMO MONTEIRO nº74 - Centro</div> <div id="vitoria"style="display:none;">AV PRINCESA ISABEL nº426 - Centro</div> <div id="serra"style="display:none;">AV JOAO PALACIOS nº300 - Fatima</div> <div id="cariacica"style="display:none;">Rod. BR 262, KM 5 nº6555 - São Francisco</div> <div id="itapemirim"style="display:none;">RUA CEL FRANCISCO BRAGA nº71/73 - Centro</div> <div id="guarapari"style="display:none;"> RUA EWERSON DE ABREU SODRE nº1 - Muquicaba</div> <div id="mateus"style="display:none;"> RUA CEL. MATEUS CUNHA nº67 - Centro</div> <div id="linhares"style="display:none;"> AV GOV JONES SANTOS NEVES nº912 - Centro</div> <div id="aracruz"style="display:none;">AV VENANCIO FLORES nº1116 - Centro</div> <div id="colatina"style="display:none;">AV GETULIO VARGAS nº203 - Centro</div> <div id="guacui"style="display:none;"> PRACA DA BANDEIRA nº1 - Centro</div> </div> </div> <div id="cidadeMinas" style="display:none; " style="position:relative;" > <select id="minas" name="form_minas" onchange="mostrarEndereco(this)" style="width: 200px" style="height: 125px; "> <option value="26">Cidade</option> <option value="27">BELO HORIZONTE</option> <option value="28">RIBEIRAO DAS NEVES</option> <option value="29">SANTA LUZIA</option> <option value="30">CONTAGEM</option> <option value="31">BETIM</option> <option value="32">CONSELHEIRO LAFAIETE</option> <option value="33">SETE LAGOAS</option> <option value="34">BARBACENA</option> <option value="35">MONTES CLAROS</option> <option value="36">JUIZ DE FORA</option> <option value="37">DIVINOPOLIS</option> <option value="38">GOVERNADOR VALADARES</option> <option value="39">TIMOTEO</option> <option value="40">IPATINGA</option> </select><br> <div class="ruasMinas" style="width: 200px; text-align: center; text-align-last: center;"> <div id="bh" style="display:none;">RUA DOS CARIJOS nº516 - Centro</div> <div id="neves"style="display:none;">RUA RAIMUNDO NONATO DE SOUZA nº26 - Centro</div> <div id="luzia"style="display:none;">AV BRASILIA nº2165 - São Benedito</div> <div id="contagem"style="display:none;">RUA TIRADENTES nº2550 - Bairro Industrial</div> <div id="betim"style="display:none;">RODOVIA BR 381 FERNÃO DIAS KM 492,6 - São João</div> <div id="lafaiete"style="display:none;"> RUA DOUTOR MELO VIANA nº10 - Centro</div> <div id="lagoas"style="display:none;"> AV DEPUTADO EMILIO DE VASCONCELOS COSTA nº34 - Centro</div> <div id="barbacena"style="display:none;"> RUA QUINZE DE NOVEMBRO nº86 - Centro</div> <div id="claros"style="display:none;">AV DONATO QUINTINO nº90 - Canelas</div> <div id="juiz"style="display:none;">RUA MARECHAL DEODORO nº558 - Centro</div> <div id="divinopolis"style="display:none;"> RUA MOACIR JOSE LEITE nº100 - Santa Clara</div> <div id="valadares"style="display:none;"> RUA MARECHAL FLORIANO nº824 - Centro</div> <div id="timoteo"style="display:none;"> ALAMENDA 31 DE OUTUBRO nº115 - Centro Norte</div> <div id="ipatinga"style="display:none;"> AV 28 DE ABRIL nº187 - Centro</div> </div> </div> <script type="text/javascript"> function mostrarCidade(select){ if(select.value==1){ document.getElementById('cidadeRio').style.display = "block"; document.getElementById('cidadeEs').style.display = "none"; document.getElementById('cidadeMinas').style.display = "none"; } else if(select.value==2){ document.getElementById('cidadeRio').style.display = "none"; document.getElementById('cidadeEs').style.display = "block"; document.getElementById('cidadeMinas').style.display = "none"; }else if(select.value==3){ document.getElementById('cidadeRio').style.display = "none"; document.getElementById('cidadeEs').style.display = "none"; document.getElementById('cidadeMinas').style.display = "block"; }else{ document.getElementById('cidadeRio').style.display = "none"; document.getElementById('cidadeEs').style.display = "none"; document.getElementById('cidadeMinas').style.display = "none"; } } function mostrarEndereco(select){ if(select.value==1){ document.getElementById('itaperuna').style.display = "block"; document.getElementById('campos').style.display = "none"; document.getElementById('ostras').style.display = "none"; document.getElementById('macae').style.display = "none"; document.getElementById('saquarema').style.display = "none"; document.getElementById('marica').style.display = "none"; document.getElementById('araruama').style.display = "none"; document.getElementById('cabo').style.display = "none"; document.getElementById('bonito').style.display = "none"; document.getElementById('pedro').style.display = "none"; document.getElementById('friburgo').style.display = "none"; document.getElementById('petropolis').style.display = "none"; document.getElementById('teresopolis').style.display = "none"; } else if(select.value==2){ document.getElementById('campos').style.display = "block"; document.getElementById('itaperuna').style.display = "none"; document.getElementById('ostras').style.display = "none"; document.getElementById('macae').style.display = "none"; document.getElementById('saquarema').style.display = "none"; document.getElementById('marica').style.display = "none"; document.getElementById('araruama').style.display = "none"; document.getElementById('cabo').style.display = "none"; document.getElementById('bonito').style.display = "none"; document.getElementById('pedro').style.display = "none"; document.getElementById('friburgo').style.display = "none"; document.getElementById('petropolis').style.display = "none"; document.getElementById('teresopolis').style.display = "none"; }else if(select.value==3){ document.getElementById('ostras').style.display = "block"; document.getElementById('campos').style.display = "none"; document.getElementById('itaperuna').style.display = "none"; document.getElementById('macae').style.display = "none"; document.getElementById('saquarema').style.display = "none"; document.getElementById('marica').style.display = "none"; document.getElementById('araruama').style.display = "none"; document.getElementById('cabo').style.display = "none"; document.getElementById('bonito').style.display = "none"; document.getElementById('pedro').style.display = "none"; document.getElementById('friburgo').style.display = "none"; document.getElementById('petropolis').style.display = "none"; document.getElementById('teresopolis').style.display = "none"; }else if(select.value==4){ document.getElementById('macae').style.display = "block"; document.getElementById('campos').style.display = "none"; document.getElementById('ostras').style.display = "none"; document.getElementById('itaperuna').style.display = "none"; document.getElementById('saquarema').style.display = "none"; document.getElementById('marica').style.display = "none"; document.getElementById('araruama').style.display = "none"; document.getElementById('cabo').style.display = "none"; document.getElementById('bonito').style.display = "none"; document.getElementById('pedro').style.display = "none"; document.getElementById('friburgo').style.display = "none"; document.getElementById('petropolis').style.display = "none"; document.getElementById('teresopolis').style.display = "none"; } else if(select.value==5){ document.getElementById('saquarema').style.display = "block"; document.getElementById('campos').style.display = "none"; document.getElementById('ostras').style.display = "none"; document.getElementById('macae').style.display = "none"; document.getElementById('itaperuna').style.display = "none"; document.getElementById('marica').style.display = "none"; document.getElementById('araruama').style.display = "none"; document.getElementById('cabo').style.display = "none"; document.getElementById('bonito').style.display = "none"; document.getElementById('pedro').style.display = "none"; document.getElementById('friburgo').style.display = "none"; document.getElementById('petropolis').style.display = "none"; document.getElementById('teresopolis').style.display = "none"; } else if(select.value==6){ document.getElementById('marica').style.display = "block"; document.getElementById('campos').style.display = "none"; document.getElementById('ostras').style.display = "none"; document.getElementById('macae').style.display = "none"; document.getElementById('saquarema').style.display = "none"; document.getElementById('itaperuna').style.display = "none"; document.getElementById('araruama').style.display = "none"; document.getElementById('cabo').style.display = "none"; document.getElementById('bonito').style.display = "none"; document.getElementById('pedro').style.display = "none"; document.getElementById('friburgo').style.display = "none"; document.getElementById('petropolis').style.display = "none"; document.getElementById('teresopolis').style.display = "none"; } else if(select.value==7){ document.getElementById('araruama').style.display = "block"; document.getElementById('campos').style.display = "none"; document.getElementById('ostras').style.display = "none"; document.getElementById('macae').style.display = "none"; document.getElementById('saquarema').style.display = "none"; document.getElementById('marica').style.display = "none"; document.getElementById('itaperuna').style.display = "none"; document.getElementById('cabo').style.display = "none"; document.getElementById('bonito').style.display = "none"; document.getElementById('pedro').style.display = "none"; document.getElementById('friburgo').style.display = "none"; document.getElementById('petropolis').style.display = "none"; document.getElementById('teresopolis').style.display = "none"; } else if(select.value==8){ document.getElementById('cabo').style.display = "block"; document.getElementById('campos').style.display = "none"; document.getElementById('ostras').style.display = "none"; document.getElementById('macae').style.display = "none"; document.getElementById('saquarema').style.display = "none"; document.getElementById('marica').style.display = "none"; document.getElementById('araruama').style.display = "none"; document.getElementById('itaperuna').style.display = "none"; document.getElementById('bonito').style.display = "none"; document.getElementById('pedro').style.display = "none"; document.getElementById('friburgo').style.display = "none"; document.getElementById('petropolis').style.display = "none"; document.getElementById('teresopolis').style.display = "none"; } else if(select.value==9){ document.getElementById('bonito').style.display = "block"; document.getElementById('campos').style.display = "none"; document.getElementById('ostras').style.display = "none"; document.getElementById('macae').style.display = "none"; document.getElementById('saquarema').style.display = "none"; document.getElementById('marica').style.display = "none"; document.getElementById('araruama').style.display = "none"; document.getElementById('cabo').style.display = "none"; document.getElementById('itaperuna').style.display = "none"; document.getElementById('pedro').style.display = "none"; document.getElementById('friburgo').style.display = "none"; document.getElementById('petropolis').style.display = "none"; document.getElementById('teresopolis').style.display = "none"; } else if(select.value==10){ document.getElementById('pedro').style.display = "block"; document.getElementById('campos').style.display = "none"; document.getElementById('ostras').style.display = "none"; document.getElementById('macae').style.display = "none"; document.getElementById('saquarema').style.display = "none"; document.getElementById('marica').style.display = "none"; document.getElementById('araruama').style.display = "none"; document.getElementById('cabo').style.display = "none"; document.getElementById('bonito').style.display = "none"; document.getElementById('itaperuna').style.display = "none"; document.getElementById('friburgo').style.display = "none"; document.getElementById('petropolis').style.display = "none"; document.getElementById('teresopolis').style.display = "none"; } else if(select.value==11){ document.getElementById('friburgo').style.display = "block"; document.getElementById('campos').style.display = "none"; document.getElementById('ostras').style.display = "none"; document.getElementById('macae').style.display = "none"; document.getElementById('saquarema').style.display = "none"; document.getElementById('marica').style.display = "none"; document.getElementById('araruama').style.display = "none"; document.getElementById('cabo').style.display = "none"; document.getElementById('bonito').style.display = "none"; document.getElementById('pedro').style.display = "none"; document.getElementById('itaperuna').style.display = "none"; document.getElementById('petropolis').style.display = "none"; document.getElementById('teresopolis').style.display = "none"; } else if(select.value==12){ document.getElementById('petropolis').style.display = "block"; document.getElementById('campos').style.display = "none"; document.getElementById('ostras').style.display = "none"; document.getElementById('macae').style.display = "none"; document.getElementById('saquarema').style.display = "none"; document.getElementById('marica').style.display = "none"; document.getElementById('araruama').style.display = "none"; document.getElementById('cabo').style.display = "none"; document.getElementById('bonito').style.display = "none"; document.getElementById('pedro').style.display = "none"; document.getElementById('friburgo').style.display = "none"; document.getElementById('itaperuna').style.display = "none"; document.getElementById('teresopolis').style.display = "none"; } else if(select.value==13){ document.getElementById('teresopolis').style.display = "block"; document.getElementById('campos').style.display = "none"; document.getElementById('ostras').style.display = "none"; document.getElementById('macae').style.display = "none"; document.getElementById('saquarema').style.display = "none"; document.getElementById('marica').style.display = "none"; document.getElementById('araruama').style.display = "none"; document.getElementById('cabo').style.display = "none"; document.getElementById('bonito').style.display = "none"; document.getElementById('pedro').style.display = "none"; document.getElementById('friburgo').style.display = "none"; document.getElementById('petropolis').style.display = "none"; document.getElementById('itaperuna').style.display = "none"; }else if(select.value==15){ document.getElementById('velha').style.display = "block"; document.getElementById('vitoria').style.display = "none"; document.getElementById('serra').style.display = "none"; document.getElementById('cariacica').style.display = "none"; document.getElementById('itapemirim').style.display = "none"; document.getElementById('guacui').style.display = "none"; document.getElementById('guarapari').style.display = "none"; document.getElementById('mateus').style.display = "none"; document.getElementById('linhares').style.display = "none"; document.getElementById('aracruz').style.display = "none"; document.getElementById('colatina').style.display = "none"; }else if(select.value==16){ document.getElementById('velha').style.display = "none"; document.getElementById('vitoria').style.display = "block"; document.getElementById('serra').style.display = "none"; document.getElementById('cariacica').style.display = "none"; document.getElementById('itapemirim').style.display = "none"; document.getElementById('guarapari').style.display = "none"; document.getElementById('mateus').style.display = "none"; document.getElementById('linhares').style.display = "none"; document.getElementById('aracruz').style.display = "none"; document.getElementById('colatina').style.display = "none"; document.getElementById('guacui').style.display = "none"; }else if(select.value==17){ document.getElementById('velha').style.display = "none"; document.getElementById('vitoria').style.display = "none"; document.getElementById('serra').style.display = "block"; document.getElementById('cariacica').style.display = "none"; document.getElementById('itapemirim').style.display = "none"; document.getElementById('guarapari').style.display = "none"; document.getElementById('mateus').style.display = "none"; document.getElementById('linhares').style.display = "none"; document.getElementById('aracruz').style.display = "none"; document.getElementById('colatina').style.display = "none"; document.getElementById('guacui').style.display = "none"; }else if(select.value==18){ document.getElementById('velha').style.display = "none"; document.getElementById('vitoria').style.display = "none"; document.getElementById('serra').style.display = "none"; document.getElementById('cariacica').style.display = "block"; document.getElementById('itapemirim').style.display = "none"; document.getElementById('guarapari').style.display = "none"; document.getElementById('mateus').style.display = "none"; document.getElementById('linhares').style.display = "none"; document.getElementById('aracruz').style.display = "none"; document.getElementById('colatina').style.display = "none"; document.getElementById('guacui').style.display = "none"; }else if(select.value==19){ document.getElementById('velha').style.display = "none"; document.getElementById('vitoria').style.display = "none"; document.getElementById('serra').style.display = "none"; document.getElementById('cariacica').style.display = "none"; document.getElementById('itapemirim').style.display = "block"; document.getElementById('guarapari').style.display = "none"; document.getElementById('mateus').style.display = "none"; document.getElementById('linhares').style.display = "none"; document.getElementById('aracruz').style.display = "none"; document.getElementById('colatina').style.display = "none"; document.getElementById('guacui').style.display = "none"; }else if(select.value==20){ document.getElementById('velha').style.display = "none"; document.getElementById('vitoria').style.display = "none"; document.getElementById('serra').style.display = "none"; document.getElementById('cariacica').style.display = "none"; document.getElementById('itapemirim').style.display = "none"; document.getElementById('guarapari').style.display = "block"; document.getElementById('mateus').style.display = "none"; document.getElementById('linhares').style.display = "none"; document.getElementById('aracruz').style.display = "none"; document.getElementById('colatina').style.display = "none"; document.getElementById('guacui').style.display = "none"; }else if(select.value==21){ document.getElementById('velha').style.display = "none"; document.getElementById('vitoria').style.display = "none"; document.getElementById('serra').style.display = "none"; document.getElementById('cariacica').style.display = "none"; document.getElementById('itapemirim').style.display = "none"; document.getElementById('guarapari').style.display = "none"; document.getElementById('mateus').style.display = "block"; document.getElementById('linhares').style.display = "none"; document.getElementById('aracruz').style.display = "none"; document.getElementById('colatina').style.display = "none"; document.getElementById('guacui').style.display = "none"; }else if(select.value==22){ document.getElementById('velha').style.display = "none"; document.getElementById('vitoria').style.display = "none"; document.getElementById('serra').style.display = "none"; document.getElementById('cariacica').style.display = "none"; document.getElementById('itapemirim').style.display = "none"; document.getElementById('guarapari').style.display = "none"; document.getElementById('mateus').style.display = "none"; document.getElementById('linhares').style.display = "block"; document.getElementById('aracruz').style.display = "none"; document.getElementById('colatina').style.display = "none"; document.getElementById('guacui').style.display = "none"; }else if(select.value==23){ document.getElementById('velha').style.display = "none"; document.getElementById('vitoria').style.display = "none"; document.getElementById('serra').style.display = "none"; document.getElementById('cariacica').style.display = "none"; document.getElementById('itapemirim').style.display = "none"; document.getElementById('guarapari').style.display = "none"; document.getElementById('mateus').style.display = "none"; document.getElementById('linhares').style.display = "none"; document.getElementById('aracruz').style.display = "block"; document.getElementById('colatina').style.display = "none"; document.getElementById('guacui').style.display = "none"; }else if(select.value==24){ document.getElementById('velha').style.display = "none"; document.getElementById('vitoria').style.display = "none"; document.getElementById('serra').style.display = "none"; document.getElementById('cariacica').style.display = "none"; document.getElementById('itapemirim').style.display = "none"; document.getElementById('guarapari').style.display = "none"; document.getElementById('mateus').style.display = "none"; document.getElementById('linhares').style.display = "none"; document.getElementById('aracruz').style.display = "none"; document.getElementById('colatina').style.display = "block"; document.getElementById('guacui').style.display = "none"; }else if(select.value==25){ document.getElementById('velha').style.display = "none"; document.getElementById('vitoria').style.display = "none"; document.getElementById('serra').style.display = "none"; document.getElementById('cariacica').style.display = "none"; document.getElementById('itapemirim').style.display = "none"; document.getElementById('guarapari').style.display = "none"; document.getElementById('mateus').style.display = "none"; document.getElementById('linhares').style.display = "none"; document.getElementById('aracruz').style.display = "none"; document.getElementById('colatina').style.display = "none"; document.getElementById('guacui').style.display = "block"; } else if(select.value==27){ document.getElementById('bh').style.display = "block"; document.getElementById('neves').style.display = "none"; document.getElementById('luzia').style.display = "none"; document.getElementById('contagem').style.display = "none"; document.getElementById('betim').style.display = "none"; document.getElementById('lafaiete').style.display = "none"; document.getElementById('lagoas').style.display = "none"; document.getElementById('barbacena').style.display = "none"; document.getElementById('claros').style.display = "none"; document.getElementById('juiz').style.display = "none"; document.getElementById('divinopolis').style.display = "none"; document.getElementById('valadares').style.display = "none"; document.getElementById('timoteo').style.display = "none"; document.getElementById('ipatinga').style.display = "none"; }else if(select.value==28){ document.getElementById('bh').style.display = "none"; document.getElementById('neves').style.display = "block"; document.getElementById('luzia').style.display = "none"; document.getElementById('contagem').style.display = "none"; document.getElementById('betim').style.display = "none"; document.getElementById('lafaiete').style.display = "none"; document.getElementById('lagoas').style.display = "none"; document.getElementById('barbacena').style.display = "none"; document.getElementById('claros').style.display = "none"; document.getElementById('juiz').style.display = "none"; document.getElementById('divinopolis').style.display = "none"; document.getElementById('valadares').style.display = "none"; document.getElementById('timoteo').style.display = "none"; document.getElementById('ipatinga').style.display = "none"; } else if(select.value==29){ document.getElementById('bh').style.display = "none"; document.getElementById('neves').style.display = "none"; document.getElementById('luzia').style.display = "block"; document.getElementById('contagem').style.display = "none"; document.getElementById('betim').style.display = "none"; document.getElementById('lafaiete').style.display = "none"; document.getElementById('lagoas').style.display = "none"; document.getElementById('barbacena').style.display = "none"; document.getElementById('claros').style.display = "none"; document.getElementById('juiz').style.display = "none"; document.getElementById('divinopolis').style.display = "none"; document.getElementById('valadares').style.display = "none"; document.getElementById('timoteo').style.display = "none"; document.getElementById('ipatinga').style.display = "none"; } else if(select.value==30){ document.getElementById('bh').style.display = "none"; document.getElementById('neves').style.display = "none"; document.getElementById('luzia').style.display = "none"; document.getElementById('contagem').style.display = "block"; document.getElementById('betim').style.display = "none"; document.getElementById('lafaiete').style.display = "none"; document.getElementById('lagoas').style.display = "none"; document.getElementById('barbacena').style.display = "none"; document.getElementById('claros').style.display = "none"; document.getElementById('juiz').style.display = "none"; document.getElementById('divinopolis').style.display = "none"; document.getElementById('valadares').style.display = "none"; document.getElementById('timoteo').style.display = "none"; document.getElementById('ipatinga').style.display = "none"; } else if(select.value==31){ document.getElementById('bh').style.display = "none"; document.getElementById('neves').style.display = "none"; document.getElementById('luzia').style.display = "none"; document.getElementById('contagem').style.display = "none"; document.getElementById('betim').style.display = "block"; document.getElementById('lafaiete').style.display = "none"; document.getElementById('lagoas').style.display = "none"; document.getElementById('barbacena').style.display = "none"; document.getElementById('claros').style.display = "none"; document.getElementById('juiz').style.display = "none"; document.getElementById('divinopolis').style.display = "none"; document.getElementById('valadares').style.display = "none"; document.getElementById('timoteo').style.display = "none"; document.getElementById('ipatinga').style.display = "none"; } else if(select.value==32){ document.getElementById('bh').style.display = "none"; document.getElementById('neves').style.display = "none"; document.getElementById('luzia').style.display = "none"; document.getElementById('contagem').style.display = "none"; document.getElementById('betim').style.display = "none"; document.getElementById('lafaiete').style.display = "blok"; document.getElementById('lagoas').style.display = "none"; document.getElementById('barbacena').style.display = "none"; document.getElementById('claros').style.display = "none"; document.getElementById('juiz').style.display = "none"; document.getElementById('divinopolis').style.display = "none"; document.getElementById('valadares').style.display = "none"; document.getElementById('timoteo').style.display = "none"; document.getElementById('ipatinga').style.display = "none"; } else if(select.value==33){ document.getElementById('bh').style.display = "none"; document.getElementById('neves').style.display = "none"; document.getElementById('luzia').style.display = "none"; document.getElementById('contagem').style.display = "none"; document.getElementById('betim').style.display = "none"; document.getElementById('lafaiete').style.display = "none"; document.getElementById('lagoas').style.display = "block"; document.getElementById('barbacena').style.display = "none"; document.getElementById('claros').style.display = "none"; document.getElementById('juiz').style.display = "none"; document.getElementById('divinopolis').style.display = "none"; document.getElementById('valadares').style.display = "none"; document.getElementById('timoteo').style.display = "none"; document.getElementById('ipatinga').style.display = "none"; } else if(select.value==34){ document.getElementById('bh').style.display = "none"; document.getElementById('neves').style.display = "none"; document.getElementById('luzia').style.display = "none"; document.getElementById('contagem').style.display = "none"; document.getElementById('betim').style.display = "none"; document.getElementById('lafaiete').style.display = "none"; document.getElementById('lagoas').style.display = "none"; document.getElementById('barbacena').style.display = "block"; document.getElementById('claros').style.display = "none"; document.getElementById('juiz').style.display = "none"; document.getElementById('divinopolis').style.display = "none"; document.getElementById('valadares').style.display = "none"; document.getElementById('timoteo').style.display = "none"; document.getElementById('ipatinga').style.display = "none"; } else if(select.value==35){ document.getElementById('bh').style.display = "none"; document.getElementById('neves').style.display = "none"; document.getElementById('luzia').style.display = "none"; document.getElementById('contagem').style.display = "none"; document.getElementById('betim').style.display = "none"; document.getElementById('lafaiete').style.display = "none"; document.getElementById('lagoas').style.display = "none"; document.getElementById('barbacena').style.display = "none"; document.getElementById('claros').style.display = "block"; document.getElementById('juiz').style.display = "none"; document.getElementById('divinopolis').style.display = "none"; document.getElementById('valadares').style.display = "none"; document.getElementById('timoteo').style.display = "none"; document.getElementById('ipatinga').style.display = "none"; } else if(select.value==36){ document.getElementById('bh').style.display = "none"; document.getElementById('neves').style.display = "none"; document.getElementById('luzia').style.display = "none"; document.getElementById('contagem').style.display = "none"; document.getElementById('betim').style.display = "none"; document.getElementById('lafaiete').style.display = "none"; document.getElementById('lagoas').style.display = "none"; document.getElementById('barbacena').style.display = "none"; document.getElementById('claros').style.display = "none"; document.getElementById('juiz').style.display = "block"; document.getElementById('divinopolis').style.display = "none"; document.getElementById('valadares').style.display = "none"; document.getElementById('timoteo').style.display = "none"; document.getElementById('ipatinga').style.display = "none"; } else if(select.value==37){ document.getElementById('bh').style.display = "none"; document.getElementById('neves').style.display = "none"; document.getElementById('luzia').style.display = "none"; document.getElementById('contagem').style.display = "none"; document.getElementById('betim').style.display = "none"; document.getElementById('lafaiete').style.display = "none"; document.getElementById('lagoas').style.display = "none"; document.getElementById('barbacena').style.display = "none"; document.getElementById('claros').style.display = "none"; document.getElementById('juiz').style.display = "none"; document.getElementById('divinopolis').style.display = "block"; document.getElementById('valadares').style.display = "none"; document.getElementById('timoteo').style.display = "none"; document.getElementById('ipatinga').style.display = "none"; } else if(select.value==38){ document.getElementById('bh').style.display = "none"; document.getElementById('neves').style.display = "none"; document.getElementById('luzia').style.display = "none"; document.getElementById('contagem').style.display = "none"; document.getElementById('betim').style.display = "none"; document.getElementById('lafaiete').style.display = "none"; document.getElementById('lagoas').style.display = "none"; document.getElementById('barbacena').style.display = "none"; document.getElementById('claros').style.display = "none"; document.getElementById('juiz').style.display = "none"; document.getElementById('divinopolis').style.display = "none"; document.getElementById('valadares').style.display = "block"; document.getElementById('timoteo').style.display = "none"; document.getElementById('ipatinga').style.display = "none"; } else if(select.value==39){ document.getElementById('bh').style.display = "none"; document.getElementById('neves').style.display = "none"; document.getElementById('luzia').style.display = "none"; document.getElementById('contagem').style.display = "none"; document.getElementById('betim').style.display = "none"; document.getElementById('lafaiete').style.display = "none"; document.getElementById('lagoas').style.display = "none"; document.getElementById('barbacena').style.display = "none"; document.getElementById('claros').style.display = "none"; document.getElementById('juiz').style.display = "none"; document.getElementById('divinopolis').style.display = "none"; document.getElementById('valadares').style.display = "none"; document.getElementById('timoteo').style.display = "block"; document.getElementById('ipatinga').style.display = "none"; } else if(select.value==40){ document.getElementById('bh').style.display = "none"; document.getElementById('neves').style.display = "none"; document.getElementById('luzia').style.display = "none"; document.getElementById('contagem').style.display = "none"; document.getElementById('betim').style.display = "none"; document.getElementById('lafaiete').style.display = "none"; document.getElementById('lagoas').style.display = "none"; document.getElementById('barbacena').style.display = "none"; document.getElementById('claros').style.display = "none"; document.getElementById('juiz').style.display = "none"; document.getElementById('divinopolis').style.display = "none"; document.getElementById('valadares').style.display = "none"; document.getElementById('timoteo').style.display = "none"; document.getElementById('ipatinga').style.display = "block"; } else{ document.getElementById('itaperuna').style.display = "none"; document.getElementById('campos').style.display = "none"; document.getElementById('ostras').style.display = "none"; document.getElementById('macae').style.display = "none"; document.getElementById('saquarema').style.display = "none"; document.getElementById('marica').style.display = "none"; document.getElementById('araruama').style.display = "none"; document.getElementById('cabo').style.display = "none"; document.getElementById('bonito').style.display = "none"; document.getElementById('pedro').style.display = "none"; document.getElementById('friburgo').style.display = "none"; document.getElementById('petropolis').style.display = "none"; document.getElementById('teresopolis').style.display = "none"; document.getElementById('velha').style.display = "none"; document.getElementById('vitoria').style.display = "none"; document.getElementById('serra').style.display = "none"; document.getElementById('cariacica').style.display = "none"; document.getElementById('itapemirim').style.display = "none"; document.getElementById('guarapari').style.display = "none"; document.getElementById('mateus').style.display = "none"; document.getElementById('linhares').style.display = "none"; document.getElementById('aracruz').style.display = "none"; document.getElementById('colatina').style.display = "none"; document.getElementById('guacui').style.display = "none"; document.getElementById('bh').style.display = "none"; document.getElementById('neves').style.display = "none"; document.getElementById('luzia').style.display = "none"; document.getElementById('contagem').style.display = "none"; document.getElementById('betim').style.display = "none"; document.getElementById('lafaiete').style.display = "none"; document.getElementById('lagoas').style.display = "none"; document.getElementById('barbacena').style.display = "none"; document.getElementById('claros').style.display = "none"; document.getElementById('juiz').style.display = "none"; document.getElementById('divinopolis').style.display = "none"; document.getElementById('valadares').style.display = "none"; document.getElementById('timoteo').style.display = "none"; document.getElementById('ipatinga').style.display = "none"; } } </script> </div>