Блог

Я использую jQuery timepicker и пытаюсь запретить пользователю вставлять недопустимые символы (буквы).

Зная, что в моей системе есть 4 временных формата, поэтому я не могу использовать регулярное выражение или маску.

Итак, я хочу знать, есть ли способ сделать это или нет.

 $('.gcureservationtimepicker').timepicker({
    timeFormat: '@AdminSiteHelper.GCUTimeFormat()',
    // timeFormat: 'HH:mm:ss',
    interval: 15,
    //maxTime: '12:00 PM',
    //defaultTime: '8',
    //startTime: '10:00',
    dynamic: false,
    dropdown: true,
    scrollbar: true,
    change: GenerateNewTimePicker
});
  

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

Если вы хотите ограничить параметры чем-то вроде только часов выбора, я бы рекомендовал вам использовать Pickadate в качестве средства выбора времени. Оно аналогично по использованию, но поле доступно только для чтения.

Обновить

Если вы не можете изменить библиотеку и вам нужно использовать timepicker, я бы подумал об ограничении параметров ввода ввода. Что-то вроде примера ниже.

Кроме того, другим вариантом, в зависимости от ваших требований к совместимости, может быть использование <input type="time"> , которое уже имеет множество необходимых вам ограничений.

Дополнительное примечание

Если хотите, вы также можете углубиться в простую проверку, которую я добавил ниже, и работать либо с регулярными выражениями, либо с позиционированием. Что-то вроде:

1. Символы 1 и 2 могут быть только числами от 00 до 23 или от 01 до 12, в зависимости от того, 12 часов или 24 часа.
2. Символ 3 может быть только двоеточием.
3. Символы 4 и 5 могут быть только числами.
4. Входная строка может содержать не более 5 символов.

Регулярное выражение для приведенной выше структуры (без проверки минимального и максимального чисел) может быть: ^d{2}:d{2}$ .

 function checkNumber() {
  var e = event || window.event; // get event object
  var key = e.keyCode || e.which; // get key cross-browser

  var allowedKeys = [8, 48, 49, 50, 51, 52, 53, 54, 55, 56, 57, 58, 186]; // includes backspace, numbers and :

  if (!allowedKeys.includes(key)) {
    if (e.preventDefault) e.preventDefault(); //normal browsers
    e.returnValue = false; //IE
  }
}  

 <input type="text" id="onlytime" onkeydown="checkNumber()" placeholder="Input time">

<br><br>

<input type="time" id="justintime">