Jquery.maskedinput js — документация на русском с примерами

numeric extensions

$(document).ready(function(){
   $("#numeric").inputmask("decimal");
   $("#numeric").inputmask("decimal", { allowMinus: false });
   $("#numeric").inputmask("integer");
});

RadixDance

With the decimal mask the caret will always jump to the integer part, until you type the radixpoint.
There is autocompletion on tab with decimal numbers. You can disable this behaviour by setting the skipRadixDance to true.

Define the radixpoint

$(document).ready(function(){
   $("#numeric").inputmask("decimal", { radixPoint: "," });
});

Define the number of digits after the radixpoint

$(document).ready(function(){
   $("#numeric").inputmask("decimal", { digits: 3 });
});

When TAB out of the input the digits autocomplate with 0 if the digits option is given a valid number.

Grouping support through: autoGroup, groupSeparator, groupSize

$(document).ready(function(){
   $("#numeric").inputmask("decimal", { radixPoint: ",", autoGroup: true, groupSeparator: ".", groupSize: 3 });
});

Allow minus and/or plus symbol

$(document).ready(function(){
   $("#numeric").inputmask("decimal", { allowMinus: false });
   $("#numeric").inputmask("integer", { allowMinus: false, allowPlus: true });
});

Как убрать предупреждение системы безопасности Windows

Важно! Полное отключение системы безопасности нежелательно, так как может представлять опасность для работы операционной системы. Можно полностью отключить систему безопасности для проверки файлов скачанных из интернета, локальной сети или с другого компьютера

Можно полностью отключить систему безопасности для проверки файлов скачанных из интернета, локальной сети или с другого компьютера.

Как ни странно, но отключение предупреждений системы безопасности Windows при запуске программ и небезопасных файлов происходит не в службе «Центр безопасности», а в свойствах браузера.

Как отключить предупреждение системы безопасности Windows:

1. Открыть меню Windows, нажав на значок с логотипом операционной системы в нижнем левом углу;
2. Перейти в раздел «Служебные»;
3. Выбрать пункт «Панель управления»;
4. Зайти в раздел «Свойства браузера».
   Более быстрый и удобный способ зайти в свойства браузера – использовать встроенную в Windows службу поиска;
5. Необходимо перейти во вкладку «Безопасность»;
6. Нажать кнопку «Другой» в подразделе «Уровень безопасности для этой зоны»;
7. Перевести переключатель в состояние «Включить» в разделе «Запуск программ и небезопасных файлов», как это показано на скриншоте ниже;
8. Последний шаг – нажать «ОК» в обоих окнах, после чего предупреждения системы безопасности Windows отключится, оно более не будет появляться при запуске файлов, программ и приложений.

Define custom definitions

You can define your own definitions to use in your mask.Start by choosing a masksymbol.

validator(chrs, maskset, pos, strict, opts)

Next define your validator. The validator can be a regular expression or a function.

The return value of a validator can be true, false or a command object.

Options of the command object

• pos : position to insert

• c : character to insert

• caret : position of the caret

• remove : position(s) to remove

  pos or

• insert : position(s) to add :

  • { pos : position to insert, c : character to insert }

• refreshFromBuffer :

  • true => refresh validPositions from the complete buffer
  • { start: , end: } => refresh from start to end

prevalidator(chrs, maskset, pos, strict, opts)

The prevalidator option is used to validate the characters before the definition cardinality is reached. (see ‘j’ example)

definitionSymbol

When you insert or delete characters, they are only shifted when the definition type is the same. This behavior can be overridden by giving a definitionSymbol. (see example x, y, z, which can be used for ip-address masking, the validation is different, but it is allowed to shift the characters between the definitions)

Inputmask.extendDefinitions({
    'f': {  //masksymbol
        "validator": "[0-9\(\)\.\+/ ]",
        "cardinality": 1,
        'prevalidator': null
    },
    'g': {
        "validator": function (chrs, buffer, pos, strict, opts) {
            //do some logic and return true, false, or { "pos": new position, "c": character to place }
        }
        "cardinality": 1,
        'prevalidator': null
    },
    'j': { //basic year
            validator: "(19|20)\\d{2}",
            cardinality: 4,
            prevalidator: 
                        { validator: "", cardinality: 1 },
                        { validator: "(19|20)", cardinality: 2 },
                        { validator: "(19|20)\\d", cardinality: 3 }
            
     },
     'x': {
        validator: "",
        cardinality: 1,
        definitionSymbol: "i" //this allows shifting values from other definitions, with the same masksymbol or definitionSymbol
     },
     'y': {
        validator: function (chrs, buffer, pos, strict, opts) {
                        var valExp2 = new RegExp("2|");
                        return valExp2.test(bufferpos - 1 + chrs);
                    },
        cardinality: 1,
        definitionSymbol: "i"
     },
     'z': {
        validator: function (chrs, buffer, pos, strict, opts) {
                       var valExp3 = new RegExp("25|2|");
                        return valExp3.test(bufferpos - 2 + bufferpos - 1 + chrs);
        },
        cardinality: 1,
        definitionSymbol: "i"
      }
});

set defaults

Defaults can be set as below.

Inputmask.extendDefaults({
    'autoUnmask': true
});
Inputmask.extendDefinitions({
  'A': {
    validator: "",
    cardinality: 1,
    casing: "upper" //auto uppercasing
  },
  '+': {
    validator: "",
    cardinality: 1,
    casing: "upper"
  }
});
Inputmask.extendAliases({
  'Regex': {
    mask: "r",
    greedy: false,
    ...
  }
});

But if the property is defined within an alias you need to set it for the alias definition.

Inputmask.extendAliases({
  'numeric' : {
    allowPlus: false,
    allowMinus: false
}});

However, the preferred way to alter properties for an alias is by creating a new alias which inherits from the default alias definition.

Inputmask.extendAliases({
    'myNum': {
            alias: "numeric",
            placeholder: '',
            allowPlus: false,
            allowMinus: false
        }
});

Once defined, you can call the alias by:

 $(selector).inputmask("myNum");

Примеры масок ввода

В таблице ниже приведены примеры использования масок ввода.

Обеспечивает ввод значения в виде

В данном случае пользователи должны вводить код города, так как в соответствующем разделе маски (000 в скобках) используется заполнитель 0.

(206) 555-0199( ) 555-0199

В этом случае в области междугородного кода используется местозаполнитель 9, поэтому междугородные коды необязательны. Кроме того, восклицательный знак (!) обусловливает заполнение маски слева направо.

Предоставляется возможность заменить буквами четыре последних цифры телефонного номера в формате США

Обратите внимание на местозаполнитель 0 в области кода города, который делает междугородный код обязательным

Любое положительное или отрицательное число, включающее не более четырех знаков и не имеющее разделителей тысяч и дробной части.

ЗЕЛЕНЫЙ339М3 МАЙ Р 452Б7

Сочетание обязательных (L) и необязательных (?) букв и обязательных цифр (0). Знак «больше» требует вводить все буквы в верхнем регистре. Чтобы использовать маску ввода этого типа, необходимо задать для типа данных поля таблицы значение Текстовый или Поле МЕМО.

Обязательный почтовый индекс и необязательная область четырехзначного расширения.

Сочетание обязательных букв и цифр, все в верхнем регистре. Данный тип маски ввода помогает, например, правильно вводить инвентарные номера или заполнять другие формы складского учета.

Supported markup options

data-inputmask attribute

You can also apply an inputmask by using the data-inputmask attribute. In the attribute you specify the options wanted for the inputmask. This gets parsed with $.parseJSON (for the moment), so be sure to use a well-formed json-string without the {}.

<input data-inputmask="'alias': 'date'" />
<input data-inputmask="'mask': '9', 'repeat': 10, 'greedy' : false" />

$(document).ready(function(){
    $(":input").inputmask();
});

data-inputmask-<option> attribute

All options can also be passed through data-attributes.

<input data-inputmask-mask="9" data-inputmask-repeat="10" data-inputmask-greedy="false" />

$(document).ready(function(){
    $(":input").inputmask();
});

Overview

This is a masked input plugin for the jQuery javascript library. It allows a user to more easily enter fixed width input where you would like them to enter the data in a certain format (dates,phone numbers, etc). It has been tested on Internet Explorer, Firefox, Safari, Opera, and Chrome. A mask is defined by a format made up of mask literals and mask definitions. Any character not in the definitions list below is considered a mask literal. Mask literals will be automatically entered for the user as they type and will not be able to be removed by the user.The following mask definitions are predefined:

• a — Represents an alpha character (A-Z,a-z)
• 9 — Represents a numeric character (0-9)
• * — Represents an alphanumeric character (A-Z,a-z,0-9)

First, include the jQuery and masked input javascript files.

<scriptsrc="jquery.js"type="text/javascript"><script><scriptsrc="jquery.maskedinput.js"type="text/javascript"><script>

Next, call the mask function for those items you wish to have masked.

jQuery(function($){   $("#date").mask("99/99/9999");   $("#phone").mask("(999) 999-9999");   $("#tin").mask("99-9999999");   $("#ssn").mask("999-99-9999");});

Optionally, if you are not satisfied with the underscore (‘_’) character as a placeholder, you may pass an optional argument to the maskedinput method.

jQuery(function($){   $("#product").mask("99/99/9999",{placeholder:" "});});

Optionally, if you would like to execute a function once the mask has been completed, you can specify that function as an optional argument to the maskedinput method.

jQuery(function($){   $("#product").mask("99/99/9999",{completed:function(){alert("You typed the following: "+this.val());}});});

Optionally, if you would like to disable the automatic discarding of the uncomplete input, you may pass an optional argument to the maskedinput method

jQuery(function($){   $("#product").mask("99/99/9999",{autoclear: false});});

You can now supply your own mask definitions.

jQuery(function($){   $.mask.definitions='';   $("#eyescript").mask("~9.99 ~9.99 999");});

You can have part of your mask be optional. Anything listed after ‘?’ within the mask is considered optional user input. The common example for this is phone number + optional extension.

jQuery(function($){   $("#phone").mask("(999) 999-9999? x99999");});

If your requirements aren’t met by the predefined placeholders, you can always add your own. For example, maybe you need a mask to only allow hexadecimal characters. You can add your own definition for a placeholder, say ‘h’, like so: Then you can use that to mask for something like css colors in hex with a .

jQuery(function($){   $("#phone").mask("#hhhhhh");});

By design, this plugin will reject input which doesn’t complete the mask. You can bypass this by using a ‘?’ character at the position where you would like to consider input optional. For example, a mask of «(999) 999-9999? x99999» would require only the first 10 digits of a phone number with extension being optional.

Применение:

Подключите JS файлы, которые вы можете найти в папке .

с помощью класса Inputmask

<script src="jquery.js"></script>
<script src="inputmask.js"></script>
<script src="inputmask.???.Extensions.js"></script>

var selector = document.getElementById("selector");

var im = new Inputmask("99-9999999");
im.mask(selector);

Inputmask({"mask": "(999) 999-9999", .... other options .....}).mask(selector);
Inputmask("9-a{1,3}9{1,3}").mask(selector);
Inputmask("9", { repeat: 10 }).mask(selector);

с помощью jquery плагина

<script src="jquery.js"></script>
<script src="inputmask.js"></script>
<script src="inputmask.???.Extensions.js"></script>
<script src="jquery.inputmask.js"></script>

или с помощью входящей в комлект поставки версии

<script src="jquery.js"></script>
<script src="jquery.inputmask.bundle.js"></script>

$(document).ready(function(){
  $(selector).inputmask("99-9999999");  //static mask
  $(selector).inputmask({"mask": "(999) 999-9999"}); //specifying options
  $(selector).inputmask("9-a{1,3}9{1,3}"); //mask with dynamic syntax
});

с помощью data-inputmask атрибута

<input data-inputmask="'alias': 'date'" />
<input data-inputmask="'mask': '9', 'repeat': 10, 'greedy' : false" />
<input data-inputmask="'mask': '99-9999999'" />

$(document).ready(function(){
  $(":input").inputmask();
  or
  Inputmask().mask(document.querySelectorAll("input"));
});

Любая опция также может быть передана через использование data-атрибута. Используйте data-inputmask-<имя опции>=»value»

<input id="example1" data-inputmask-clearmaskonlostfocus="false" />
<input id="example2" data-inputmask-regex="[a-za-zA-Z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-zA-Z0-9!#$%&'*+/=?^_`{|}~-]+)*@(?:(?:*)?\.)+(?:*)?" />

$(document).ready(function(){
  $("#example1").inputmask("99-9999999");
  $("#example2").inputmask("Regex");
});

Если вы хотите автоматически привязать маску ввода для отметки ввода с data-inputmask- … атрибутами, вы можете включить inputmask.binding.js

...
<script src="inputmask.binding.js"></script>
...

Если вы используете модуль загрузки requireJS

Добавьте в ваш config.js

paths: {
  ...
  "inputmask.dependencyLib": "../dist/inputmask/inputmask.dependencyLib.jquery",
  "inputmask": "../dist/inputmask/inputmask",
  ...
}

Библиотеки зависимостей вы можете выбрать между поддерживаемыми библиотеками.

• inputmask.dependencyLib (vanilla)
• inputmask.dependencyLib.jquery
• inputmask.dependencyLib.jqlite
• …. (другие приветствуются)

Разрешенные HTML-элементы

• (и все остальные при поддержке contenteditable)
• любой html-элемент (текстовое содержимое маски или установка значения маски с jQuery.val)

Символы для маски по умолчанию

• : цифры
• : буквы алфавита
• : буквы и цифры

Есть несколько символов для маски ввода, определенных в ваших расширениях.Вы можете найти информацию в JS-файлах или путем дальнейшего изучения опций.

Можно ли восстановить удалённые сообщения на iPhone

Не во всех случаях имеется возможность восстановить SMS-сообщения. Для восстановления нужно чтобы:

1. СМС-сообщения были удалены или утеряны недавно.
2. После утери iPhone не был перезагружен, и оперативная память не была переполнена, иначе кеш-память, в которой и находятся стёртые СМС, уничтожается.
3. Текстовые сообщения находились на Сим-карте, а не в памяти iPhone.

Только если все упомянутые выше условия соблюдены, можно начинать восстанавливать удалённые СМС, но прежде нужно проверить раздел «Сообщения», ведь иногда в этом разделе есть пункт «Удалённые», а там могут храниться все удалённые пользователем текстовые сообщения и чаты.

В случае если проверка папки «Удалённые» и использование методов восстановления с помощью iTunes и iCloud не помогли, можно попробовать воспользоваться специальными программами, которые предназначены для восстановления СМС.

Определение пользовательского символа маски

Вы можете определить свои собственные символы для использования в вашей маске. Начните с выбора символа маски.

валидатор(chrs, maskset, pos, strict, opts)

Затем определите свой валидатор. Проверка может быть регулярным выражением или функцией.

Возвращаемое значение валидатор может быть истинным, ложным или объектом.

Опциональные команды

• pos : позиция для вставки

• c : символ для вставки

• caret : позиция каретки

• remove : позиция (позиции) для удаления

  pos или

• insert : позиции (позиций) для добавления :

  • { pos : позиция вставки, c : символ для вставки }

• refreshFromBuffer :

  • true => refresh validPositions from the complete buffer
  • { start: , end: } => refresh from start to end

prevalidator(chrs, maskset, pos, strict, opts)

Опция предварительной проверки используется для проверки символов перед кардинальным определением, которое будет достигнуто. (См ‘J’ пример)

definitionSymbol

При вставке или удалении символов, они смещаются только тогда, когда определение типа является то же самое. Такое поведение может быть отменено, давая definitionSymbol. (См пример х, у, z, который может быть использован для IP-адреса маски, проверка отличается, но допускается сдвиг символов между определениями)

Inputmask.extendDefinitions({
  'f': {  //masksymbol
    "validator": "[0-9\(\)\.\+/ ]",
    "cardinality": 1,
    'prevalidator': null
  },
  'g': {
    "validator": function (chrs, buffer, pos, strict, opts) {
      //do some logic and return true, false, or { "pos": new position, "c": character to place }
    }
    "cardinality": 1,
    'prevalidator': null
  },
  'j': { //basic year
    validator: "(19|20)\\d{2}",
    cardinality: 4,
    prevalidator: 
      { validator: "", cardinality: 1 },
      { validator: "(19|20)", cardinality: 2 },
      { validator: "(19|20)\\d", cardinality: 3 }
    
  },
  'x': {
    validator: "",
    cardinality: 1,
    definitionSymbol: "i" //это позволяет сдвига значениt из других определений, с тем же символом маски или определения символа
  },
  'y': {
    validator: function (chrs, buffer, pos, strict, opts) {
      var valExp2 = new RegExp("2|");
      return valExp2.test(bufferpos - 1 + chrs);
    },
    cardinality: 1,
    definitionSymbol: "i"
  },
  'z': {
    validator: function (chrs, buffer, pos, strict, opts) {
      var valExp3 = new RegExp("25|2|");
      return valExp3.test(bufferpos - 2 + bufferpos - 1 + chrs);
    },
    cardinality: 1,
    definitionSymbol: "i"
  }
});

set defaults

Значения по умолчанию могут быть установлены, как показано ниже.

Inputmask.extendDefaults({
  'autoUnmask': true
});
Inputmask.extendDefinitions({
  'A': {
    validator: "",
    cardinality: 1,
    casing: "upper" //автоматический перевод в верхний регистр
  },
  '+': {
    validator: "",
    cardinality: 1,
    casing: "upper"
  }
});
Inputmask.extendAliases({
  'Regex': {
    mask: "r",
    greedy: false,
    ...
  }
});

Но если свойство определяется в качестве псевдонима необходимо установить его для определения псевдонима.

Inputmask.extendAliases({
  'numeric': {
    allowPlus: false,
    allowMinus: false
  }
});

Тем не менее, предпочтительный способ, чтобы изменить свойства псевдонима путем создания нового псевдонима, который наследуется из определения псевдонима по умолчанию.

Inputmask.extendAliases({
  'myNum': {
    alias: "numeric",
    placeholder: '',
    allowPlus: false,
    allowMinus: false
  }
});

После того, как определено, вы можете вызвать псевдоним с помощью:

$(selector).inputmask("myNum");

Все обратные вызовы реализованы в виде опций. Это означает, что вы можете установить общие для реализации обратных вызовов путем установки по умолчанию.

Inputmask.extendDefaults({
  onKeyValidation: function(key, result){
    if (!result){
      alert('Ваше введенное значение не верно')
    }
  }
});

Способ второй: переводим проценты в десятичную дробь

Как вы помните, процент — сотая часть числа. В виде десятичной дроби это 0,01 (ноль целых одна сотовая). Следовательно, 17% – это 0,17 (ноль целых, семнадцать сотых), 45% – 0,45 (ноль целых, сорок пять сотых) и т. д. Полученную десятичную дробь умножаем на сумму, процент от которой считаем. И находим искомый ответ.

Например, давайте рассчитаем сумму подоходного налога от зарплаты 35 000 рублей. Налог составляет 13%. В виде десятичной дроби это будет 0,13 (ноль целых, тринадцать сотых). Умножим сумму 35 000 на 0,13. Получится 4 550. Значит, после вычета подоходного налога вам будет перечислена зарплата 35 000 – 4 550 = 30 050. Иногда эту сумму уже без налога называют «зарплатой на руки» или «чистой». В противовес этому сумму вместе с налогом «грязной зарплатой». Именно «грязную зарплату» указывают в объявлениях о вакансиях компании и в трудовом договоре. На руки же даётся меньше. Сколько? Теперь вы легко посчитаете.

Alias definitions

date & datetime aliases

$(document).ready(function(){
   $("#date").inputmask("dd/mm/yyyy");
   $("#date").inputmask("mm/dd/yyyy");
   $("#date").inputmask("date"); // alias for dd/mm/yyyy
   $("#date").inputmask("date", {yearrange: { minyear: 1900, maxyear: 2099 }}); //specify year range
});

The date aliases take leapyears into account. There is also autocompletion on day, month, year.
For example:

input: 2/2/2012 result: 02/02/2012
input: 352012 result: 03/05/2012
input: 3/530 result: 03/05/2030
input: ctrl rightarrow result: the date from today

$(document).ready(function(){
   $("#date").inputmask("datetime"); // 24h
   $("#date").inputmask("datetime12"); // am/pm
});

numeric aliases

$(document).ready(function(){
   $("#numeric").inputmask("decimal");
   $("#numeric").inputmask("non-negative-decimal");
   $("#numeric").inputmask("integer");
});

With the decimal mask the caret will always jump to the integer part, until you type the radixpoint.
There is autocompletion on tab with decimal numbers.

Define the radixpoint

$(document).ready(function(){
   $("#numeric").inputmask("decimal", { radixPoint: "," });
});

Define the number of digits after the radixpoint

$(document).ready(function(){
   $("#numeric").inputmask("decimal", { digits: 3 });
});

Grouping support through: autoGroup, groupSeparator, groupSize

$(document).ready(function(){
   $("#numeric").inputmask("decimal", { radixPoint: ",", autoGroup: true, groupSeparator: ".", groupSize: 3 });
});

other aliases

An ip adress alias for entering valid ip-addresses.

$(document).ready(function(){
   $(selector).inputmask("ip");
});

You can find/modify/extend this alias in the jquery.inputmask.extensions.js

Использование масок ввода для адресов электронной почты

Поскольку адреса электронной почты могут быть самой разной длины, маски ввода не подходят для их проверки при вводе. Вместо масок ввода рекомендуется использовать свойства Правило проверки и Сообщение об ошибке.

Условие на значение, приведенное в таблице ниже, гарантирует, что адрес электронной почты будет состоять из одного или нескольких знаков, знака «@», еще одного или нескольких знаков, точки и еще одного или нескольких знаков. Например, адрес proverka@example.com будет правильным, а proverka@example,com или proverka@example — нет. Если ввести адрес электронной почты, не соответствующий условию на значение, введенные данные будут отклонены и появится сообщение, указанное в свойстве Сообщение об ошибке. Если свойство Сообщение об ошибке не задано, будет выведено стандартное сообщение.

Is Null Or ((Like «*?@?*.?*») And (Not Like «**»))

Сообщение об ошибке (необязательно)

Введите адрес электронной почты со знаком «@» и полным именем домена (пример: frank@contoso.com).

Дополнительные сведения о применении правил проверки, а также пошаговые инструкции см. в статье Ограничение ввода данных с помощью правил проверки.

Выполнить функцию после завершения ввода

Плагин также может выполнить функцию после завершения ввода:

$("#phone").mask("+7 (999) 999 - 9999",{completed:function(){alert("ОК!");}});

Маска ввода в полях формы на jQuery

Оригинал статьи Маска ввода в полях формы на jQuery

Masked input — очередной плагин предназначенный для всеми горячо любимого javascript фремворка jQuery, он позволяет облегчить жизнь вам и вашим пользователям, тем что с его помощью можно установить строгий формат ввода (маску ввода) в текстовые поля формы что хорошо подойдет для ввода времени, даты, телефона и т.п.

Плагин корректно работает во всех браузерах начитаная с IE6 +, FF 1.5 +, Opera, Safari, Chrome.

И так, что же нужно сделать для того, что бы начать использовать данный плагин на своем сайте? Для начала подключите javascript файлы jQuery и плагина к вашей странице, выглядеть это будет примерно так:

<script src="jquery.js" type="text/javascript"></script>
<script src="jquery.maskedinput.js" type="text/javascript"></script>

Далее нужно вызвать функцию плагина для всех элементов формы для которых надо создать маску, и передать в нее необходимые параметры:

jQuery(function($){
   $("#date").mask("99/99/9999");
   $("#phone").mask("(999) 999-9999");
   $("#tin").mask("99-9999999");
   $("#ssn").mask("999-99-9999");
});

Функция плагина принимает 2 параметра первый — сама маска для ввода, второй — объект дополнительных параметров. Маска ввода представляет из себя строку состоящую из спец символов:

a — трактуется как буквенный символ из диапазона (A-Z,a-z)
9 — трактуется как числовой символ (0-9)
* — трактуется как алфавитно цифровой символ (A-Z,a-z,0-9)

Все символы кроме перечисленных выше трактуются как литералы.

В объекте дополнительных параметров можно указать заполнитель маски ввода, по умолчанию он равен _, к примеру вы захотели изменить его на пробел, тогда ваш код вызова функции плагина будет выглядеть примерно так:

jQuery(function($){
   $("#product").mask("99/99/9999",{placeholder:" "});
});

Так же в качестве дополнительного параметра можно указать функцию обратного вызова, которая будет вызвана после того как все элементы маски будут заполнены, например:

jQuery(function($){
   $("#product").mask("99/99/9999",{completed : function(){
       alert("Вы ввели: "+this.val());}
   });
});
Вы мож

ете использовать свои определения для спецсимволов маски ввода к примеру, вы хотите что бы пользователь мог указывать разность или сумму чисел тогда вы можете сделать это следующим образом:

jQuery(function($){
   $.mask.definitions='';
   $("#eyescript").mask("~9.99 ~9.99 999");
});

Иногда бывают такие ситуации, что возникает потребность не заполнять пользователем некоторую часть маски ввода, для этого вы можете использовать спецсимвол ? — все что идет после этого символа является не обязательным для ввода с стороны пользователя, например:

jQuery(function($){
   $("#phone").mask("(999) 999-9999? x99999");
});

Вот это наверное и все основные возможности данного плагина, используйте его в своих проектах и вы сделаете жизнь неопытного пользователя маленечко проще 🙂

Usage:

Include the js-files which you can find in the dist-folder. You have the bundled file which contains the main plugin code and also all extensions. (date, numerics, other) or if you prefer to only include some parts, use the separate js-files in the dist/min folder.

The minimum to include is the jquery.inputmask.js

<script src="jquery.js" type="text/javascript"></script>
<script src="jquery.inputmask.js" type="text/javascript"></script>

Define your masks:

$(document).ready(function(){
   $("#date").inputmask("d/m/y");  //direct mask
   $("#phone").inputmask("mask", {"mask": "(999) 999-9999"}); //specifying fn & options
   $("#tin").inputmask({"mask": "99-9999999"}); //specifying options only
});

or

<input data-inputmask="'alias': 'date'" />
<input data-inputmask="'mask': '9', 'repeat': 10, 'greedy' : false" />
<input data-inputmask="'mask': '99-9999999'" />

$(document).ready(function(){
    $(":input").inputmask();
});

Default masking definitions

• 9 : numeric
• a : alfabetic

There are more definitions defined within the extensions.
You can find info within the js-files or by further exploring the options.

Методы:

mask(elems)

Создание маски ввода

$(selector).inputmask({ mask: "99-999-99"});

или

Inputmask({ mask: "99-999-99"}).mask(document.querySelectorAll(selector));

или

Inputmask("99-999-99").mask(document.querySelectorAll(selector));

или

var im : new Inputmask("99-999-99");
im.mask(document.querySelectorAll(selector));

или

Inputmask("99-999-99").mask(selector);

unmaskedvalue

Get the

$(selector).inputmask('unmaskedvalue');

или

var input = document.getElementById(selector);
if (input.inputmask)
  input.inputmask.unmaskedvalue()

Value unmasking

Unmask a given value against the mask.

var unformattedDate = Inputmask.unmask("23/03/1973", { alias: "dd/mm/yyyy"}); //23031973

удаление

Удаление .

$(selector).inputmask('remove');

или

var input = document.getElementById(selector);
if (input.inputmask)
  input.inputmask.remove()

или

Inputmask.remove(document.getElementById(selector));

getemptymask

return the default (empty) mask value

$(document).ready(function(){
  $("#test").inputmask("999-AAA");
  var initialValue = $("#test").inputmask("getemptymask");  // initialValue  => "___-___"
});

hasMaskedValue

Проверьте маскируется ли возвращаемое значение или нет; В настоящее время только надежно работает при использовании jquery.val функции для извлечения значения

$(document).ready(function(){
  function validateMaskedValue(val){}
  function validateValue(val){}

  var val = $("#test").val();
  if ($("#test").inputmask("hasMaskedValue"))
    validateMaskedValue(val);
  else
    validateValue(val);
});

isComplete

Проверяет, осуществлен ли полный ввод значения или нет

$(document).ready(function(){
  if ($(selector).inputmask("isComplete")){
    //do something
  }
});

getmetadata

Метаданные фактической маски, представленной в определениях маски может быть получено с помощью вызова getmetadata. Если только маска при условии определения маски будет возвращен getmetadata.

$(selector).inputmask("getmetadata");

установка значения

SetValue функциональность, чтобы установить значение для inputmask, как вы могли бы сделать с jQuery.val, но это вызовет внутреннее событие, используемый inputmask всегда, в любом случае. Это особенно полезно при клонировании inputmask с jQuery.clone. Клонирование inputmask не является полностью функциональным клоном. На первом случае (MouseEnter, фокус …) сотрудник inputmask может обнаружить, если он где клонировали может активировать маскирование. Однако при установке значения с jQuery.val не существует ни одно из событий сработавших в этом случае. SetValue функциональность делает это для вас.

option(options, noremask)

Get or set an option on an existing inputmask.
The option method is intented for adding extra options like callbacks, etc at a later time to the mask.

When extra options are set the mask is automatically reapplied, unless you pas true for the noremask argument.

Set an option

document.querySelector("#CellPhone").inputmask.option({
  onBeforePaste: function (pastedValue, opts) {
    return phoneNumOnPaste(pastedValue, opts);
  }
});

$("#CellPhone").inputmask("option", {
  onBeforePaste: function (pastedValue, opts) {
    return phoneNumOnPaste(pastedValue, opts);
  }
})

Формат

Вместо того, чтобы маскировать входного элемента также можно использовать для форматирования inputmask для форматирования заданных значений. Подумайте о форматировании значений, чтобы показать в jqGrid или на других элементах затем вводит.

var formattedDate = Inputmask.format("2331973", { alias: "dd/mm/yyyy"});

var isValid = Inputmask.isValid("23/03/1973", { alias: "dd/mm/yyyy"});

Supported markup options

data-inputmask attribute

You can also apply an inputmask by using the data-inputmask attribute. In the attribute you specify the options wanted for the inputmask. This gets parsed with $.parseJSON (for the moment), so be sure to use a well-formed json-string without the {}.

<input data-inputmask="'alias': 'date'" />
<input data-inputmask="'mask': '9', 'repeat': 10, 'greedy' : false" />

$(document).ready(function(){
  $(":input").inputmask();
});

data-inputmask-<option> attribute

All options can also be passed through data-attributes.

<input data-inputmask-mask="9" data-inputmask-repeat="10" data-inputmask-greedy="false" />

$(document).ready(function(){
  $(":input").inputmask();
});

Property Details

$_hashVar
protected property

The hashed variable to store the pluginOptions

protected string = null

$aliases
public property

Custom aliases to use. Should be configured as , where

• is a string containing a text to identify your mask alias definition (e.g. ‘phone’) and
• is an array containing settings for the mask symbol, exactly similar to parameters as passed in .

public array = null

$clientOptions
public property

The JQuery plugin options for the input mask plugin.

See also https://github.com/RobinHerbots/Inputmask.

public array = []

$definitions
public property

Custom mask definitions to use. Should be configured as , where

• is a string, containing a character to identify your mask definition and
• is an array, consisting of the following entries:
  • : string, a JS regular expression or a JS function.
  • : int, specifies how many characters are represented and validated for the definition.
  • : array, validate the characters before the definition cardinality is reached.
  • : string, allows shifting values from other definitions, with this .

public array = null

$mask
public property

The input mask (e.g. ’99/99/9999′ for date input). The following characters
can be used in the mask and are predefined:

• : represents an alpha character (A-Z, a-z)
• : represents a numeric character (0-9)
• : represents an alphanumeric character (A-Z, a-z, 0-9)
• and : anything entered between the square brackets is considered optional user input. This is
  based on the setting in .

Additional definitions can be set through the property.

public string|array|yii\web\JsExpression = null

$options
public property

The HTML attributes for the input tag.

See also for details on how attributes are being rendered.

public array = [‘class’ => ‘form-control’

$type
public property
(available since version 2.0.6)

The type of the input tag. Currently only ‘text’ and ‘tel’ are supported.

See also https://github.com/RobinHerbots/Inputmask.

public string = ‘text’