Как разрешить число от 0 до 12, а также иметь дополнительный шаблон помимо него

Question

Я пытаюсь определить шаблон для HTML, и я не могу заставить его работать ...

В результате я ищу нечто меньшее, чем это число: "12.50"

<input type='text' class='form-control' name='wrap' id='wrap' placeholder='0.00' pattern='^([1-9]|1[012]+[.]+[0-5]+[0])$' required>

Я ожидаю, что первое число будет числом от 0 до 12, после этого "." и после этого число между 0-5 и в конце просто 0.

Это работает, если у меня есть только регулярное выражение 0-12, но когда я добавляю шаблон для периода и остальных, он тормозит и не работает.

Answer 1

Ваша группировка и использование квантификаторов неверны. Кроме того, ^ и $ являются избыточными в регулярном выражении HTML5 pattern, поскольку эти шаблоны заключаются в ^(?: и )$ автоматически при компиляции.

Вы можете использовать более точный шаблон, например

pattern='(?:[1-9]|1[012])\.[0-5]0'

Он будет скомпилирован как /^(?:(?:[1-9]|1[012])\.[0-5]0)$/ (или с модификатором u в Firefix и Chrome) и будет соответствовать:

• ^ - начало строки
• (?: - начало внешней зоны захвата
  • (?:[1-9]|1[012]) - номера группы без захвата, соответствующие номерам от 1 т до 12
  • \. - точка
  • [0-5]0 - цифра от 0 до 5 и затем ноль
• )$ - конец внешней группировки и конец строки.

См. Демонстрационную версию regex и Regulex graph :

Answer 2

Хорошо, у меня все получилось, я не знал, что "|"означает ИЛИ, поэтому мне пришлось немного подправить свой код.

  <input type='text' class='form-control' name='wrap' id='wrap' placeholder='0.00' pattern='^([0-9][.][0-5][0]|1[012][.][0-5][0])$' required>

, поэтому у меня было раньше ^ ([1-9] | 1 [012] + [.] + [0-5] + [0]) $

Если я разделю это, я получу:

[1-9]

И

1 [012] + [.]+ [0-5] + [0]

Что мне действительно нужно, так это добавить + [.] + [0-5] + [0] к обоим шаблонам