Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Victor Ferreira

[Resolvido] Como impedir que uma letra seja inserida num INPUT?

Por , em Javascript

Recommended Posts

Victor Ferreira    0

Victor Ferreira
Postado

Amigos, é o seguinte. Estou desenvolvendo um algorítimo que somente possam inserir números num INPUT TEXT. Daí criei um array.

 

Sempre que o Key torna-se UP (onkeyup) eu chamo uma função que verifica se o que foi digitado é uma dessas letras. Agora se eu usar aquele método de RETURN no ONKEYUP não rola: o caractere continua lá no INPUT.

 

Isso provavelmente acontece porque o ONKEYUP só ocorre DEPOIS da letra entrar no campo de texto.

 

Gostaria somente de um esclarecimento. Sabem dizer se é por isso mesmo? Pelo fato do ONKEYUP só ocorrer depois do caractere já estar dentro do campo?

 

Outra coisa é uma sugestão. Acham que eu devo guardar numa variável o valor do campo sem o último caractere, e caso ele não seja uma letra recuperar o valor antigo do campo?

 

Aqui vai o código

<html>
	<head>
            <title>Máscara hora</title>
            <style type="text/css">
                .hora_minuto{
                    width: 50px;
                }
            </style>
            <script type="text/javascript">

                var caracteresPossiveis = new Array('1','2','3','4','5','6','7','8','9','0');
                var qtdCaracteres = caracteresPossiveis.length;

                function verificaCaractere(campo){
                    var texto = campo.value;
                    var ultimoCaractere = texto.charAt(texto.length-1);
                    for(var i = 0; i<qtdCaracteres; i++){
                        if(ultimoCaractere==caracteresPossiveis[i]){
                            return true;
                        }
                        return false
                    }
                }
            </script>
	</head>
	
	<body>
            <input type="text" id="hora" maxlength="2" class="hora_minuto" onkeyup="return verificaCaractere(this)"/>
            <input type="text" id="minuto" maxlength="2" class="hora_minuto"/>
	</body>
</html>

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

tem uma forma bem mais simples..

 

usando Expressão Regular..

http://forum.imasters.com.br/index.php?/topic/392605-mascara-numerica/page__view__findpost__p__1531413

Compartilhar este post

Link para o post
Compartilhar em outros sites

Victor Ferreira    0

Victor Ferreira
Postado

William, li sua solução. Amanhã estudarei-a mais. Preciso pegar um livro de ER para dar uma lida e aprender isso legal. Parece que funciona bem,.

 

Da maneira que eu sugeri logo acima:

<html>
	<head>
            <title>Máscara hora</title>
            <script type="text/javascript">

                var caracteresPossiveis = new Array('1','2','3','4','5','6','7','8','9','0');
                var qtdCaracteres = caracteresPossiveis.length;

                function verificaCaractere(campo){
                    var texto = campo.value;
                    var qtdCaracteresCampo = campo.value.length;

                    var textoSemUltimoCaractere = texto.slice(0, qtdCaracteresCampo-1);
                    var ultimoCaractere = texto.charAt(qtdCaracteresCampo-1);

                    var permitido = false;
                    //alert(texto+"  "+qtdCaracteres+" "+textoSemUltimoCaractere+" "+ultimoCaractere+" "+permitido+" "+qtdCaracteresCampo);
                    for(var i = 0; i<qtdCaracteres; i++){
                        if(ultimoCaractere==caracteresPossiveis[i]){
                            permitido = true;
                        }
                    }
                    if(permitido==false){
                        campo.value = textoSemUltimoCaractere;
                    }
                }
            </script>
	</head>
	
	<body>
            <input type="text" id="hora" maxlength="2" class="hora_minuto" onkeyup="return verificaCaractere(this)"/>
            <input type="text" id="minuto" maxlength="2" class="hora_minuto"/>
	</body>
</html>

Compartilhar este post

Link para o post
Compartilhar em outros sites

Victor Ferreira    0

Victor Ferreira
Postado

A Expressão Regular sugerida funciona na boa!

 

Outra idéia vem aqui:

 

function verificaCaractere(event){
    var KeyCode;

    if(event.keyCode){KeyCode=event.keyCode;}
    else if(event.which){KeyCode=event.charCode;}

    return eCaractereValido(KeyCode);
}

function eCaractereValido(keyCodeCaractere){
    var caracteresValidos = new Array('48','49','50','51','52','53','54','55','56','57','8','9','46');
    var qtdCaracteresValidos = caracteresValidos.length;

    //var caractereValido = false;
    for(var i = 0; i < qtdCaracteresValidos; i++){
        if(caracteresValidos[i]==keyCodeCaractere){
            return true;
        }
    }

    return false;
}


<input type=text name=teste id=teste maxlength="5" onKeyDown="return verificaCaractere(event);"/>

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito