1. java
  2. android
  3. c#
  4. .net
  5. javascript
  6. php
  7. jquery
  8. html
  9. sql

Alerta de campo vazio/ verificação de campo.

Então gente, quando clica no campo pra digitar o texto tem que apagar a frase de aviso e o texto fica em vermelho, como consertar?

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8">
<title>Cadastro</title>
</head>
<body bgcolor="#93DB70" background="../imagem/bg2.png"><br>
<form name="form" action="cadastro.html" method="post">
<p align="center"><b>CADASTRO DE USUÁRIOS</b><br><br>
<tr>
<td width="15%"><font size="3" face="arial">Nome:</font></td><br>
<td><input type="text" name="Nome" size="30"></td><br><br>
</tr>
<tr>
<td width="15%"><font size="3" face="arial">Data de Nascimento:</font></td><br>
<td><input type="text" name="Data" size="10" maxlength="10" onkeypress="mascara(this)"></td><br><br>
</tr>
<tr>
<td width="15%"><font size="3" face="arial">Login:<font color="red">*</font></font></td><br>
<td><input type="text" name="login" size="30" onblur="alertaCampoVazio(this);" onfocus="alertaCampoVazio(this);"></td><br><br>
</tr>
<tr>
<td width="15%"><font size="3" face="arial">E-mail para Cadastro <font color="red">*</font></td><br> 
<td><input type="text" name="mail"  size="30" onblur="alertaCampoVazio(this);" onfocus="alertaCampoVazio(this);"></td><br><br>
<td width="15%"><font size="3" face="arial">Senha <font color="red">*</font></td><br>
<td><input type="password" name="senha" size="30" onblur="alertaCampoVazio(this);" onfocus="alertaCampoVazio(this);"></td><br><br>
</tr>
<td width="15%"><font size="3" face="arial">Repita a Senha <font color="red">*</font></td><br>
<td><input type="password" name="repita" size="30" onblur="alertaCampoVazio(this);" onfocus="alertaCampoVazio(this);"></td><br>
</tr><br>
<font size="3" face="arial">Tipo de Conta:
<label>
<select>
<option value="Indefinido">Indefinido</option>
</label></select><br><br>
<font size="3" face="arial" color="red">(*)Campos de preenchimento obrigatório<br><br>
<input type="submit" value="Cadastrar" onsubmit="return validar();">
</form>
<script type="text/javascript">    
function alertaCampoVazio(login){
if(login.value ==""){
login.value="Campo de preenchimento obrigatório";
login.style.color="red";
}
}
function alertaCampoVazio(mail){
if(mail.value ==""){
mail.value="Campo de preenchimento obrigatório";
mail.style.color="red";
}
}
function alertaCampoVazio(senha){
if(senha.value ==""){
senha.value="Campo de preenchimento obrigatório";
senha.style.color="red";
}
}
function alertaCampoVazio(repita){
if(repita.value ==""){
repita.value="Campo de preenchimento obrigatório";
repita.style.color="red";
}
}

function validar() {
if (document.form.login.value == '') {
document.write ('Todos os campos sao obrigatorios.');
return false;
} else {
    alert("Todos os campos foram preenchidos.");
return true;
}
}

function mascara(data){ 
if(data.value.length == 2)
data.value = data.value + '/';
if(data.value.length == 5)
data.value = data.value + '/'; 
}
</script>  
</body>
</html>
  • esta usando javascript ou jquery?

    Guga   15 de jul de 2015
  • estou usando javascript

    Ana Valeria Bezerra   16 de jul de 2015
  1. Você vai ver essas setas em qualquer página de pergunta. Com elas, você pode dizer se uma pergunta ou uma resposta foram relevantes ou não.
  2. Edite sua pergunta ou resposta caso queira alterar ou adicionar detalhes.
  3. Caso haja alguma dúvida sobre a pergunta, adicione um comentário. O espaço de respostas deve ser utilizado apenas para responder a pergunta.
  4. Se o autor da pergunta marcar uma resposta como solucionada, esta marca aparecerá.
  5. Clique aqui para mais detalhes sobre o funcionamento do GUJ!

1 resposta

Não é a resposta que estava procurando? Procure outras perguntas com as tags javascript ou faça a sua própria pergunta.