Я хочу получить только десятичные значения, например, 1,5,0,56 и т.д., Но это позволяет использовать более одной точки. есть ли способ предотвратить это
Вы можете использовать атрибут pattern
:
<input type="number" pattern="[0-9]+([\.,][0-9]+)?">
Это позволит использовать шаблоны с одной точкой или даже запятой (например, европейскими десятичными знаками). Чтобы удалить запятую, необходимо:
<input type="number" pattern="[0-9]+([\.][0-9]+)?">
Вы можете использовать JavaScript для записи любых изменений входного значения и проверить, является inputAsNumber
свойство inputAsNumber
еще действительным числом. Если нет, вы можете вернуться к предыдущему значению:
restoreData = {};
inp.oninput = preventTwoDots;
restoreData['inp'] = inp.value;
function preventTwoDots() {
if (isNaN(this.valueAsNumber) && this.selectionStart) {
this.value = restoreData['inp'];
}
restoreData['inp'] = this.value;
}
<input type="number" id="inp">
Дополнительная проверка на selectionStart
гарантирует, что вы все равно можете удалить все цифры: пустой ввод считается недопустимым номером, но было бы странно не удалять последний символ из ввода.
Хотя это то, о чем вы просили в своем вопросе, обратите внимание, что блокирование ввода пользователя не является особенно удобным для пользователя. Браузеры дают визуальные подсказки, когда ввод недействителен (при фиксации значения, например, когда вы покидаете поле ввода), что обычно так и должно быть сделано. Вы не хотите, чтобы люди думали, что их клавиатура терпит неудачу, или пусть они думают, что буфер обмена пуст, потому что их копирование/вставка "не работает".