Какой type выбрать для поля или как установить ограничение на него?

Question

[oyshomusic]

Добрый день!
Есть строка для ввода цифр:

<div class="wrap-input100 validate-input" data-validate="Name is required">
					<input class="input100" type="number" min="2" max="144" name="core" required placeholder="Количество ядер (2-144 шт.)">
					<span class="focus-input100"></span>
				</div>

Мне необходимо сделать так, чтобы в неё можно было ввести значение от 2 до 144 (в моём случае работает 99999+++)

Comments

[twobomb]

В вашем случае работает от 2 до 144. Если делать это стрелками то ограничение работает. Если руками введете больше и это будет в форме и нажмете сабмит, то он ругнется что не входит в диапазон

[oyshomusic]

twobomb, просто сама проблема заключается в том что он считает все эти введённые данные, а хотелось бы установить предел (в данном случае до 144)

[twobomb]

oyshomusic, что значит считает данные, поставьте проверку чтобы не считал если выходит за диапазон или повесьте событие на input или change и проверяйте диапазон при каждом вводе

Answer 1

[Александр]

document.querySelectorAll('input[type="number"]').forEach(input => {
	input.addEventListener('input', () => {
		if (input.value !== '') {
			const min = input.min !== '' ? Number(input.min) : -Infinity;
			const max = input.max !== '' ? Number(input.max) : Infinity;
			const value = Number(input.value);
			
			input.value = Math.max(min, Math.min(value, max));
		}
	});
});