ClassMask: jQuery Input Mask Plugin Examples

A jQuery Plugin that makes it possible to format and validate different data types like email, phone, number, money, zip, date, etc. in any input text field.

Mask number and string

class="mask_number"
class="mask_string_upper"
class="mask_string_capitalize"

Mask money and fraction

class="mask_money"
class="mask_fraction_medium"
class="mask_fraction_full"

Mask phones

class="mask_phone"
class="mask_cell"
class="mask_phones"

Mask documents

class="mask_cpf"
class="mask_cnpj"
class="mask_document"

Mask zip, date and email

class="mask_email"
class="mask_date"
class="mask_zip"

Bonus, note feedback maxlength

Basic Example

The simplest template to get started is the following.

Everything you need to start is:

  1. Include jQuery and Class Mask App in your HTML code.
  2. Then add a class of your need.

Another way to do this:

  1. Include jQuery and Class Mask in your HTML code.
  2. Then add a jQuery event, call the classMask method to change the value.

Or if you prefer:

  1. Include only Class Mask in your HTML code.
  2. Then add a listener.

Bonus textarea:

  1. Include jQuery and Class Mask App in your HTML code.
  2. Then add a class called note in the textarea parent.
  3. Also add a class called sheet-content in the wrapper content.
  4. Attribute maxlength required or will not work.