Как ограничить максимальную ширину ввода номера html5

поле ввода должно позволить вводить только цифры в диапазоне -9.99 .. 99,99Как ограничить максимальную ширину ввода номера html5

Я попытался ниже страница в настольном и мобильном Chrome, но она позволяет вводить большие числа, например, 99999

Как исправить это с помощью html5? Я могу использовать Chrome только для этого.

<!DOCTYPE html> 
<html lang="en" xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <meta charset="utf-8" /> 
    <title></title> 
</head> 
<body> 
    <input id="Soiduaeg" name="Soiduaeg" value="" maxlength="5" type="number" pattern="[0-9]+([\.|,][0-9]+)?"> 
</body> 
</html>

источник

2016-01-01 Andrus

попытка макс = "5" вместо MAXLENGTH –

Вы должны добавить min и max значения входного элемента, муравей обеспечивают step="any" или step="0.01" атрибут:

<input id="number" type="number" step="any" min="-9.99" max="99.99" />

Для проверки занесены значения Вы нужны JavaScript:

var $input = document.querySelector('#number'); 
$input.addEventListener('blur', function(){ 
    var val = parseFloat($input.value), 
    min = parseFloat($input.getAttribute('min')), 
    max = parseFloat($input.getAttribute('max')); 

    if (val > max) { 
     $input.value = max; 
    } else if (val < min) { 
     $input.value = min; 
    } 
});

Fiddle demo

источник

2016-01-01 19:02:24

Это позволяет вводить большие номера с клавиатуры. Нажатие вкладки для сохранения недопустимого числа. Как исправить, чтобы недопустимое число не разрешалось? – Andrus

См. Обновленный ответ –

Это сохраняет недопустимые данные в базу данных без каких-либо сообщений. Форма отправляется с использованием ajax. Форма может быть сохранена с помощью горячей клавиши. В этом случае размытия не происходит. Как это исправить? Может быть, loop over html5 в методе ajax sbmit, показать сообщение и отменить отправку, если значение недействительно. – Andrus

для десятичных чисел, связать это событие oninput

например: 5,2 (nnnnn.dd)

//max number positions 5 before '.' or ',' 
var n = 5; 
//max number of digit 
var d = 2; 
//max text length 8 
var l = n + d + 1; 

if (this.value.length > n && 
    (this.value.indexOf('.') == -1 && this.value.indexOf(',') == -1)) 
{ 
    this.value = this.value.slice(0,n); 
} 
else 
{ 
    if (this.value.length > l) 
     this.value = this.value.slice(0,l); 
}; 
if (
    (this.value.indexOf('.') != -1 && this.value.length - d >= this.value.indexOf('.')) || 
    (this.value.indexOf(',') != -1 && this.value.length - d >= this.value.indexOf(',')) 
) 
{ 
    this.value = this.value.slice(0, this.value.length - (this.value.length - (this.value.indexOf('.') +d+1))); 
}

источник

2016-01-19 10:30:00

Как ограничить максимальную ширину ввода номера html5

ответ

Смежные вопросы