Input de cartão de crédito com JS

Workshop

15 vídeos • 01:23:38

Seção 01 | Introdução

  1. 1.

    Introdução

    00:45
  2. 2.

    Requisitos do Projeto

    03:10
  3. 3.

    Iniciando o Projeto e limpando os arquivos

    03:05

Seção 02 | HTML

  1. 4.

    Criando a estrutura do HTML

    05:57

Seção 03 | CSS

  1. 5.

    CSS: Criando o Layout

    05:07
  2. 6.

    CSS: Estilizando o Cartão

    08:53
  3. 7.

    CSS: Estilizando o Formulário

    08:30

Seção 04 | JS e Interatividade

  1. 8.

    JS: Acessando os elementos HTML

    06:48
  2. 9.

    JS: Formatando o número do cartão

    09:19
  3. 10.

    JS: Transpondo outros campos para o cartão

    02:39
  4. 11.

    JS: Aceitando apenas dígitos numéricos

    03:02
  5. 12.

    Criando o verso do cartão

    07:15
  6. 13.

    Fazendo o verso aparecer automaticamente

    03:02
  7. 14.

    Animando a rotação do cartão

    07:18
  8. 15.

    Responsividade para Mobile

    08:48
Login
Workshops>Input de cartão de crédito com JS>JS: Formatando o número do cartão

Acesso exclusivo para membros PRO

Esse conteúdo é exclusivo para nossos assinantes.

Libere esse e muito mais conteúdo assinando o Codante PRO.

JS: Formatando o número do cartão

Ensinamos como implementar o event listener para tornar o formulário do cartão de crédito interativo usando JavaScript puro. Trabalhamos na funcionalidade de atualizar o número do cartão em tempo real conforme o usuário insere os dados, incluindo o retorno ao placeholder inicial ao apagar os números. Além disso, formatamos a apresentação do número do cartão em blocos de quatro dígitos.

Comentários

(0)