Fóruns sobre PHP, JavaScript, HTML, MySQLi, jQuery, Banco de Dados, CSS


Moderador: web

 
Avatar do usuário
ADMIN
ADMIN
Tópico Autor
Mensagens: 17513
Nome: Kleber
Descrição do site: Onde você encontra scripts grátis para o seu site
Sexo: Masculino
Localização: RJ / RJ / Brasil
Contato:

Número de verificação de fomulário

09-02-2007 18:36

Vamos aprender nesse artigo a mostrar números aleatórios onde deverá o usuário preencher o mesmo número em um campo para enviar o formulário.

Vou mostrar um exemplo de um formulário com 2 campos: nome e número de verificação, explicação no código:

1ª parte

<script language="JavaScript"> // em cada var (num1 a num4) criamos números aleatório de 0 à 10 var num1 = Math.random()*10 var num1 = Math.round(num1) var num2 = Math.random()*10 var num2 = Math.round(num2) var num3 = Math.random()*10 var num3 = Math.round(num3) var num4 = Math.random()*10 var num4 = Math.round(num4)   function verificar_numero(form) {   // atalho para os campos do formulario (var nome,numero) var nome = document.formulario.nome.value; var numero = document.formulario.numero.value;   // validação para se o campo nome está vazio if (nome == "") { alert("Coloque seu nome"); formulario.nome.focus(); return false; } else { // somamos todas as vars do número para comparar com a digitada var n = "" + num1 +"" + num2 +"" + num3 +"" + num4 +"";   // verifica se o digitado é diferente do aleatório if (numero!=n) { alert("você não digitou o número correto!"); formulario.numero.focus(); return false; }   }} </script>

2ª parte

<script language="JavaScript"> // aqui mostramos os números aleatórios // abaixo umas configurações para colorir os números e posicionar // para não ficar tudo paralelo document.write("<span style='position:relative;top:-3'><font face=tahoma size=4 color=green>"+num1+"</font></span>&nbsp;") document.write("<font face=times size=3 color=red>"+num2+"</font>&nbsp;") document.write("<span style='position:relative;top:3'><font face=times size=3 color=orange>"+num3+"</font></span>&nbsp;") document.write("<font face=times size=3 color=black>"+num4+"</font>&nbsp;") </script>

3ª parte
segue o formulário de exemplo para nosso script acima

<FORM ACTION="mailto:e-mail@e-mail.com.br" name="formulario" method="POST" onSubmit="return verificar_numero(this)"> O seu nome: <INPUT TYPE="text" NAME="nome" SIZE="10"> O número é: <INPUT TYPE="text" NAME="numero" SIZE="3"> <INPUT TYPE="submit" VALUE="Enviar"> </FORM>

Adicione os campos que desejar e troque as cores dos números aleatórios no script.
0
A melhor hospedagem para o seu site HostGator!

Quem está online

Usuários navegando neste fórum: Nenhum usuário registrado