Форматирование чисел на jQuery онлайн

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

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

Проще для всех сделать проверку введенной информации еще на этапе ввода, что позволяет сделать JS.

Практически недавно лопнул стеклопакет пластикового окна. Это произошло ночью и выглядело достаточно жутко. Не откладывая на потом, я нашел организацию, которая зарекомендовала себя на рынке как одна из лучших организаций по установке пластиковых окон – http://plastika-okon.ru. Сделали все быстро и к тому же предложили достаточно серьезную скидку. Приятно работать с профессионалами.

Что нас спасет?

С приходом HTML5 стало возможным проверять input`ы на предмет вводе не нужных символов. За это отвечает параметр pattern. Но пока что он недостаточно гибок и не позволяет решить все необходиме потребности.

Именно из-за этого и приходиться прибегать к старому доброму JS.

Проще всего реализовать такую проверку на JS+jQuery+плагин Masked Input. Этот плагин позволяет осуществлять проверку дотаточно гибко.

Официальная страница проекта находиться здесь, где можно посмотреть примеры того, что умеет этот плагин так и скачать его.

Реализация

Для начала нам необходимо подключить jQuery и плагин Masked Input

<script src="/js/jquery.js"></script>
<script src="/js/jquery.maskedinput.js"></script>

После подключения можно уже начинать использовать:

<script>
  $(function() {
    $(".date").mask("99.99.9999");           // Для даты
    $(".phone").mask("(999) 999-9999");      // Для телефона
  });
</script>

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

Комментарии:

Имя
e-mail
Сайт
Текст комментария: