Маска jQuery для документов с нулями и справа налево - PullRequest
2 голосов
/ 02 февраля 2011

Hy человек,

Я использую плагин jquery.maskedit для нескольких полей в своем приложении, и я не могу найти способ составить маску, подобную этой:

Документ: 000000-0

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

Есть ли плагин jQuery или кто-то знает, как настроить эту маску с помощью jquery.maskedit?

1 Ответ

0 голосов
/ 29 мая 2013

Отказ от ответственности: есть ошибки. Но это один из способов сделать это.

JSFiddle

$.fn.specialMask = function () {
  this.on('click focus', function () { 
      var self = this; 
      setTimeout(function() {self.value = self.value;}, 15); //move cursor to end
  }) 
  .on('keypress', function (e) {
      var 
          num,
          $this = $(this),
          cur = $this.val().match(/Document: ([0-9]*\-[0-9])/); //get value

      if (cur[1][0] !== '0') { return; } //input is full

      if (e.keyCode >= 48 && e.keyCode <= 57) { //numeric keys
          num = e.keyCode - 48;
      } else if (e.keyCode >= 96 && e.keyCode <= 105) { //numpad
          num = e.keyCode - 96;
      } else { 
          return;   
      }
      cur = cur[1].replace('-', '').substr(1) + '-' + num; //shift value left
      $this.val('Document: ' + cur); //update input
  });
};

$('#tehInput').mask('Document: 999999-9', {placeholder: '0'}).specialMask(); // initialize the input

Я использовал jquery.maskedinput.js, так как не смог найти упомянутый вами плагин maskedit. Если у вас есть ссылка, попробуйте добавить ее в jsfiddle - надеюсь, она будет работать аналогично другим плагинам?

Замена заполнителей справа налево сложно подделать (как вы можете видеть выше), если она не встроена в плагин. Несколько более простой трюк, который я однажды сделал, заключался в том, чтобы сделать фальшивый ввод:

<div class="input-wrapper">
    <span class="input-pre"></span>
    <input type="text">
</div>

Затем вы можете настроить оболочку так, чтобы она выглядела как обычный ввод, задайте для фактического ввода пустой белый цвет без рамки и сфокусируйте ввод, когда на оболочке происходит событие «щелчка». Поместите ваши ведущие 0 в предварительный промежуток, обновляйте его с помощью JS, и никто не станет мудрее!

...