Jump to content
klonder

Máscaras para TextField em JavaScript

Recommended Posts

Tentei incluir a máscara a seguir em um POST meu antigo, porém está fechado para novas respostas:

 

Todavia, para futuras consultas minhas e também para ajudar outras pessoas, venho deixar uma máscara interessante que acabei de terminar em JavaScript.

Ficou muito menor que a do POST acima:

<script type="text/javascript">
var iCount1;
var trava = false;

function MaskDown(e) {    
    if (trava == false) {
        iCount1 = e.value.length;
        trava = true;
    }
}

function MaskUp(e,mascara) {
    if (trava) {
        var textoLimpo = e.value.substr(0,iCount1+1).replace(/[\/\:\-\.]/g,"");
        var texto = "";
        
        var iM = 0;
        var iT = 0;
        while (iM < mascara.length) {
            if (iT < textoLimpo.length) {                
                if (mascara.substr(iM,1) == "#") {
                   texto += textoLimpo.substr(iT,1);
                   iT++;
                } else {
                    texto += mascara.substr(iM,1);
                }            
            }
        iM++;           
        }
    e.value = texto;
    trava = false;
    }    
}
</script>

Para funcionar, basta incluir em suas tags input os eventos, como demonstrado a seguir:

<input type="text" id="tfData" onkeydown="MaskDown(this)" onkeyup="MaskUp(this,'##/##/####')" placeholder="dd/mm/aaaa" style="width:80px" />
<br /><input type="text" id="tfHora" onkeydown="MaskDown(this)" onkeyup="MaskUp(this,'##:##')" placeholder="hh:mm"  style="width:50px"/>
    

À medida que o usuário vai digitando, o valor campo vai sendo formatado. Pode ser usado para CPF, CEP, RG, dentre outros...

 

Divirtam-se!

  • +1 1

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Similar Content

    • By leonardorocha
      Prezados, boa tarde!
       
      Tenho uma apresentação que imprime determinados valores de acordo com a data cadastrada no sistema.
       
      O código abaixo está funcionando para algumas datas e outras não. Um exemplo é o intervalo de datas 01/03/2019 a 30/06/2019
       
      Este nunca é executado conforme o código abaixo. Se alguém souber aonde encontra-se o erro por favor me informe.
      <div class="row justify-content-md-center"> <?php foreach ($model->getItems() as $calendar) { $dataI = date("d/m/Y", strtotime($calendar->start_date)); $dataF = date("d/m/Y", strtotime($calendar->end_date)); $titulo = $calendar->title; ?> <div class="col-md-3 col-sm-6"> <div class="item-calendario"> <div itemprop="event" itemscope itemtype="http://schema.org/Event"> <?php $atual = strtotime(date("d/m/Y")); $periodo = array('inicio' => strtotime($dataI), 'fim' => strtotime($dataF)); if($atual >= $periodo['inicio'] && $atual <= $periodo['fim'] ){ echo '<div class="icone-calendario"><i class="fa fa-clock-o fa-lg" aria-hidden="true" style="color:#0661ab"></i></div> <div class="status-calendario agora"><span>AGORA</span></div>'; } if($atual < $periodo['inicio'] && $atual < $periodo['fim'] ){ echo '<div class="status-calendario"><span>EM BREVE</span></div>'; } ?> <div class="periodo-calendario" itemprop="startDate" content="{{startDateIso}}"> <span><?php echo $dataI . ' a ' . $dataF ?></span> </div> <div class="texto-calendario"> <a href="<?php echo $calendar->url; ?>" itemprop="url"> <span itemprop="name"><?php echo $titulo; ?></span> </a> </div> </div> </div> </div> <?php } ?> </div>  
    • By Highlander1901
      Senhores, buenas... não consigo efetuar esse SELECT, e já quebrei a cabeça pra dar certo. Podem me ajudar?
       
      SELECT
               "A"."CCUSTO" as "Célula",
               "A"."IDCONTR" as "Matrícula",
               "A"."NOME",
               "A"."SINDICATO",
               "A"."DESCEVENTO",
               "A"."LOCAL",
               (HOUR("A"."JAN") + (MINUTE("A"."JAN") / 60)) as "Mes Anterior",
               (HOUR("A"."FEV") + (MINUTE("A"."FEV") / 60)) as "Mes Atual",
               ((HOUR("A"."JAN") + (MINUTE("A"."JAN") / 60)) -(HOUR("A"."FEV") + (MINUTE("A"."FEV") / 60))) as "Crescimento",
               (MINUTE("A"."FEV") / 60) as "Minutos"
      FROM  "BD_HORAS" AS  "A" 
      WHERE     "A"."CCUSTO"  = '113'
       OR    "A"."CCUSTO"  = '432'
       
      Detalhes de erro:
      Qualquer uma das opções abaixo poderia ser a possibilidade para o erro:

      1. Poderia haver tipos incompatíveis de dados em um dos lados do operador comparador. Nesse caso, converta as colunas e tente novamente.

      2. Não há função correspondente ao nome  e argumento fornecidos. Você pode precisar adicionar conversões do tipo explícita.   Obs.: Sempre utilizei esse código, o que alterava era apenas o as colunas "JAN" e "FEV", dependendo do avanço dos meses.
       
      HEEEELP!
    • By Vinny Oliveira
      Bom dia pessoal!
       
      Devido as mudanças no horário de verão que estão ocorrendo atualmente, algumas plataformas adiantaram incorretamente o horário.
      O comando "date" do php está retornando o horário adiantado, sendo que o servidor (windows) está com a hora e timezone(php.ini e clock do windows) correta.
      De onde o PHP está buscando esse horário? Como corrigir?
    • By asacap1000
      Galera preciso de uma ajuda, não sei mais nem como procurar a cabeça está dando nó kkkk.
      Tenho projeto que estará controlando o tempo de acesso no estabelecimento impondo um limite de 100 minutos.
      Dentro do mesmo dia estou conseguindo realizar os calculos normais, porém se o usuário entrar 23:00 ele terá que sair no máximo às 00:40.
      O horário eu consegui montar conforme o select abaixo a data mantém a mesma da entrada.
      select aces.seqreg SEQUENCIA, aces.diracc SENTIDO, aces.horacc MINUTOS, --acesso em minutos (aces.horacc + 100) LIMITE, --limite de acesso foi adicionado mais 100 minutos CONVERT(varchar(2), Day(aces.datacc)) + '/' + CONVERT(varchar(2), MONTH(aces.datacc)) + '/' + CONVERT(varchar(4), Year(aces.datacc)) + ' ' + right( '00' + cast(aces.horacc / 60 as varchar), 2) + ':' + right( '00' + cast(aces.horacc - ((aces.horacc / 60) * 60) as varchar), 2 ) AS HORA,--data e hora de entrada CONVERT(varchar(2), Day(aces.datacc)) + '/' + CONVERT(varchar(2), MONTH(aces.datacc)) + '/' + CONVERT(varchar(4), Year(aces.datacc)) + ' ' + right( '00' + cast( ((aces.horacc + 100)%1440)/60 as varchar), 2) + ':' + right( '00' + cast(((aces.horacc + 100)%1440)%60 as varchar), 2 ) 'SAIDA', --data e hora que deve sair Convert(Char(5),GetDate(),114) ATUAL from kansas.kansas.r070ara aces LEFT JOIN kansas.kansas.r090mvi mv on aces.numcra = mv.numcra and aces.numdoc = mv.numdoc where CONVERT(DATETIME, CONVERT(NVARCHAR(10), aces.datacc, 103), 103) >= CONVERT(DATETIME, '29/09/2018', 103) and CONVERT(DATETIME, CONVERT(VARCHAR(10), aces.datacc, 103), 103) <= CONVERT(DATETIME, '29/09/2018', 103) and (aces.coddsp like '1') and aces.numdoc = '325605397' order by aces.seqreg, aces.nompes, aces.coddsp O problema está nesta parte do select:
       
      CONVERT(varchar(2), Day(aces.datacc)) + '/' + CONVERT(varchar(2), MONTH(aces.datacc)) + '/' + CONVERT(varchar(4), Year(aces.datacc)) + ' ' + right( '00' + cast( ((aces.horacc + 100)%1440)/60 as varchar), 2) + ':' + right( '00' + cast(((aces.horacc + 100)%1440)%60 as varchar), 2 ) 'SAIDA', --data e hora que deve sair A parte de data ele não traz a data seguinte na imagem abaixo a saída deveria ser 30/09/2018 01:27
       

       
      Alguém poderia me dar uma força tenho que entregar essa semana este projeto no trabalho e está muito punk a bagaça...
       
    • By Rodymb
      Bom dia!
       
      Preciso fazer um update em um campo do tipo  int de uma tabela para corrigir o horário e a informação que estou buscando está em um campo do tipo datetime de outra tabela. Fiz um update da seguinte forma:
       
      update zan_m00 set m00zc=(SELECT convert(varchar(11),dataemissao,114) FROM tab_nota_header where dataemissao between '2018-08-01 00:00:00' and '2018-08-01 23:59:59' and numpdv=111 and codloja=1 and numnota=74841) where m00af='2018-08-01' and m00za=1 and m00ac=111 and m00ad=69614
       
      Esse update retornou a seguinte mensagem:
      Falha ao converter o varchar valor '11:56:57:00' para o tipo de dados int.
       
      No lugar onde está varchar experimentei usar int, entretanto, ele faz o update somando todo o conteúdo do campo, também usei o CAST e o problema é o mesmo.
      Se eu fizer somente o select, ele retorna pra mim somente a hora, que é o que preciso, mas aí tem outro problema, no campo tipo int a hora é tudo junto 115657 e nesse select ele retorna 11:56:57.
       
      Existe alguma forma de fazer esse update da forma que preciso?
       
×

Important Information

Ao usar o fórum, você concorda com nossos Terms of Use.