portaWix

Membros
  • Content Count

    1
  • Joined

  • Last visited

Community Reputation

0 Neutro

About portaWix

  1. Pessoal no código abaixo, dentro do script apos o conteudo dentro de window.onload, fora dele vocês podem observar a funçaõ showHide (el, mode), ela dispara um evento no formulário de modo que se uma das condições dentro dos if's dentro de window.onload não for obedecida uma mensagem de erro temporizada e ativada, mostrada por 2 segundos e depois desaparece. Gostaria de saber por que se essa mesma funçao for declarada dentro de window.onload antes de ser usada nos if, isso gera um BUG no qual ela não temporiza da forma correta (testei pra varios valores de segundos), e a mesma so funciona se for omitido o return false depois do if. ps: O CODIO DO JEITO QUE ESTA, FUNCIONA, DESDE QUE A FUNCAO showHide() esteja FORA DE window.onload, porem quando declarada dentro GERA O BUG <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR...nsitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Exercicio 05</title> <link href='http://fonts.googlea...reek,vietnamese' rel='stylesheet' type='text/css'> <script type="text/javascript"> window.onload = function () { var form = document.getElementById("form"); var nome = document.getElementById("name"); var phone = document.getElementById("phone"); var mail = document.getElementById("mail"); var login = document.getElementById("login"); var pass = document.getElementById("password"); var send = document.getElementById("submit"); var validaEmail = /^\[email protected]\w+\.com$/igm; var validaLogin = /^(\w|\d)+$/igm; var allInputs = document.getElementsByTagName("input"); for (var i = 0; i < allInputs.length; i++) { allInputs.size = 40; } function insertMessage (idElement, message) { var element = document.getElementById(idElement); element.innerHTML = message; } send.onclick = function () { if (nome.value == "" || mail.value == "" || login.value == "" || pass.value == "") { insertMessage('error', 'Preencha todos os campos obrigatórios!'); showHide('error', 'block'); } else if (validaEmail.test(mail.value) == false){ insertMessage('error', 'Email no formato incorreto!'); showHide('error', 'block'); } else if ((login.value.length > 12 ||login.value.length < 6) && validaLogin.test(login.value)){ insertMessage('error', 'Login deve ter entre 4 a 12 caracteres e não pode usar caracteres especiais!'); showHide('error', 'block'); } else { showHide('error', 'none'); form.submit(); } return false; } } function showHide (el, mode) { document.getElementById(el).style.display = mode; setTimeout("showHide('error', 'none')", 2000); } </script> <style type="text/css"> * { margin: 0px; padding: 0px; list-style: none; outline: none; } form { width: 400px; height: 500px; border: 2px solid #000000; border-radius: 30px; margin: 50px auto; } label { display: block; margin-left: 70px; margin-top: 40px; font-family: 'Roboto Condensed', sans-serif; } input { margin-left: 70px; margin-bottom: 30px; font-family: 'Roboto Condensed', sans-serif; display: block; } #error { width: 400px; height: 40px; border: 2px solid #000000; border-radius: 30px; margin: 10px auto; background-color: #d6a95f; text-align: center; text-transform: uppercase; line-height: 40px; font-size: 15px; font-family: 'Roboto Condensed', sans-serif; display: none; } </style> </head> <body> <div id="error"></div> <form action="" method="get" id="form"> <label for="name">Nome* : </label> <input type="text" name="nome" id="name"/> <label for="phone">Telefone : </label> <input type="text" name="telefone" id="phone"/> <label for="mail">E-mail* : </label> <input type="text" name="email" id="mail"/> <label for="login">Login* : </label> <input type="text" name="login" id="login"/> <label for="password">Senha* : </label> <input type="password" name="senha" id="password"/> <input type="submit" name="enviar" id="submit"/> </form> </body> </html>