Разрешить ввод только 1-12 и 00-59 в HTML / Javascript с регулярным выражением и заменой строки

Question

Чтобы следовать 12-часовому формату времени, я пытаюсь заменить текст в двух полях ввода, одно из которых допускает только цифры от 1 до 12, а другое - только от 00 до 59. До сих пор я использовал замену строки JavaScript, когда не содержит шаблон регулярного выражения для входного события.

Я экспериментировал с различными вариантами отрицательного прогнозирования (замените, если не содержат эти значения) приведенное ниже регулярное выражение, но безуспешно

<input type="text" oninput="this.value = this.value.replace(/?!(1[0-2]|[1-9])/g, '');" />

Answer 1

Одним из способов может быть использование test и сопоставление цифры от 1 -12 с использованием ^(?:1[0-2]|[1-9])$

Если значение не 1 - 12, тогда установите пустую строку.

<form id="" name="">
  <input type="text" oninput="if (!/^(?:1[0-2]|[1-9])$/.test(this.value)) { this.value = '' }" />
</form>

Answer 2

Отрицательное утверждение в регулярном выражении всегда равно "нулевой ширине"; то есть, нет определенной части строки, которая не соответствует.

Чтобы понять почему, рассмотрим строку «123», введенную в поле минут; очевидно, он не соответствует шаблону / 1 [0-2] | [1-9] /, но какая часть делает его не соответствующим? Это 3, оставляя вас 12? Или, может быть, 1, оставив вам 23? Или, может быть, оба 2 и 3 должны быть удалены, оставляя только 1?

Вместо того чтобы делать отрицательное утверждение, лучший подход в таком случае, как это, вероятно, состоит в том, чтобы обнаружить часть, которую вы хотите сохранить, захватить ее, а затем отбросить все остальное. Например, если вы сопоставите /^.*?(1[0-2]|[1-9])?.*?$/, вся строка будет всегда совпадать, и действительная часть (если она есть) будет в переменной захвата $ 1; так что вы можете заменить всю строку этой захваченной частью, фактически удалив остальную часть (. *? в начале и в конце).