Mettre en place des masques dans des champs input

Jquery Mask Plugin est, comme son nom l’indique, un plugin jquery qui permet de mettre en place des masques sur des champs input. Le but étant de forcer, ou d’aider, l’utilisateur à saisir des informations sous le bon format.

Le cas le plus courant est un champs date, si on n’utilise pas un datepicker, on ne peut pas être sur du format utilisé par l’utilisateur.

Une fois le plugin inclus dans vote page html vous pouvez mettre en place très simplement le plugin :

$(function(){
      $('.date').mask('00/00/0000');
      $('.time').mask('00:00:00');
      $('.date_time').mask('00/00/0000 00:00:00');
      $('.cep').mask('00000-000');
      $('.phone').mask('0000-0000');
      $('.phone_with_ddd').mask('(00) 0000-0000');
      $('.phone_us').mask('(000) 000-0000');
      $('.mixed').mask('AAA 000-S0S');
      $('.cpf').mask('999.999.999-99', {reverse: true});
      $('.money').mask('000.000.000.000.000,00', {reverse: true});
});

Voici la légende des symbole pour les masques :

Site officiel ou Télécharger