Шаблон ввода HTML5 (запретите сначала 0)

Question

Я пытаюсь позволить пользователю ввести номер версии. Минимум 3 числа в парах по 2 типа:

1.1.1

или

11.11.11

или

11.10.11.1

Я только НЕ хочу, чтобы первый номер начинался с 0 , например:

01.1.1

или

0.11.11.11

Я не хочу 0 ( Я очень рад, что зашел так далеко )

<form onsubmit="alert('Submitted.');return false;">
	<input type="text" required="" pattern="((^|\.)(([1-9]?\d))){2,4}$" value="" placeholder="Try it out.">
	<input type="submit" value="»">
</form>

Answer 1

Используйте

input:valid {
  color: black;
}
input:invalid {
  color: red;
}

<form onsubmit="alert('Submitted.');return false;">
    <input type="text" required pattern="[1-9]\d?(?:\.\d{1,2}){1,3}" value="" placeholder="Try it out.">
    <input type="submit" value="»">
</form>

Шаблон будет переведен в /^(?:[1-9]\d?(?:\.\d{1,2}){1,3})$/ и будет соответствовать

• ^(?: - начало строки с началом группы без захвата
• [1-9]\d? - цифра от 1 до 9, а затем любая необязательная цифра
• (?:\.\d{1,2}){1,3} - от 1 до 3 случаев:
  • \. - точка
  • \d{1,2} - любые 1 или 2 цифры
• )$ - конец автоматически сгенерированной группы и конец строки.

См. regex demo онлайн .