HTML5: тип ввода чисел, который принимает только целые числа?

Question

Я использую jQuery Tools Validator , который реализует проверки HTML5 через jQuery.Пока все отлично работает, кроме одной вещи.В спецификации HTML5 тип ввода «число» может иметь как целые числа, так и числа с плавающей запятой.Это кажется невероятно недальновидным, поскольку это будет полезным средством проверки, только если поля вашей базы данных имеют числа с плавающей запятой со знаком (для неподписанных целочисленных значений вам придется вернуться к проверке «шаблона» и, таким образом, потерять дополнительные функции, такие как стрелки вверх и вниз).для браузеров, которые его поддерживают).Есть ли другой тип ввода или, возможно, атрибут, который будет ограничивать ввод только целыми числами без знака?Я не смог найти ничего, спасибо.

РЕДАКТИРОВАТЬ

Хорошо, ребята, я ценю ваше время и помощь, но я вижу, что происходит много незаслуженного голосования: D,Установка шага в 1 не является ответом, так как он не ограничивает ввод.Вы все еще можете ввести отрицательное число с плавающей запятой в текстовое поле.Кроме того, я знаю о проверке шаблонов (я упоминал об этом в моем первоначальном сообщении), но это не было частью вопроса.Я хотел знать, позволяет ли HTML5 ограничивать ввод типа «число» положительными целочисленными значениями.Похоже, что на этот вопрос ответ будет «нет, это не так».Я не хотел использовать валидацию шаблонов, потому что это вызывает некоторые недостатки при использовании валидации jQuery Tools, но теперь кажется, что спецификация не допускает более чистого способа сделать это.

Answer 1

Возможно, это не подходит для каждого варианта использования, но

<input type="range" min="0" max="10" />

может хорошо выполнять свою работу: скрипка .

Проверьте документацию .

Answer 2

Я работал на Chrome и у меня были некоторые проблемы, хотя я использую атрибуты html. Я закончил с этим кодом JS

$("#element").on("input", function(){
        var value = $(this).val();

        $(this).val("");
        $(this).val(parseInt(value));

        return true;
});

Answer 3

Set step="any". Работает отлично. Справка: http://blog.isotoma.com/2012/03/html5-input-typenumber-and-decimalsfloats-in-chrome/

Answer 4

Просто поместите его в поле ввода: onkeypress='return event.charCode >= 48 && event.charCode <= 57'

Answer 5

Из спецификации

step="any" или положительное число с плавающей точкой
Определяет гранулярность значения элемента.

Так что вы можете просто установить его на 1:

Answer 6

Установите атрибут step для любого числа с плавающей запятой, например, 0,01 и все готово.

Answer 7

var valKeyDown;
var valKeyUp;


function integerOnly(e) {
    e = e || window.event;
    var code = e.which || e.keyCode;
    if (!e.ctrlKey) {
        var arrIntCodes1 = new Array(96, 97, 98, 99, 100, 101, 102, 103, 104, 105, 8, 9, 116);   // 96 TO 105 - 0 TO 9 (Numpad)
        if (!e.shiftKey) {                          //48 to 57 - 0 to 9 
            arrIntCodes1.push(48);                  //These keys will be allowed only if shift key is NOT pressed
            arrIntCodes1.push(49);                  //Because, with shift key (48 to 57) events will print chars like @,#,$,%,^, etc.
            arrIntCodes1.push(50);
            arrIntCodes1.push(51);
            arrIntCodes1.push(52);
            arrIntCodes1.push(53);
            arrIntCodes1.push(54);
            arrIntCodes1.push(55);
            arrIntCodes1.push(56);
            arrIntCodes1.push(57);
        }
        var arrIntCodes2 = new Array(35, 36, 37, 38, 39, 40, 46);
        if ($.inArray(e.keyCode, arrIntCodes2) != -1) {
            arrIntCodes1.push(e.keyCode);
        }
        if ($.inArray(code, arrIntCodes1) == -1) {
            return false;
        }
    }
    return true;
}

$('.integerOnly').keydown(function (event) {
    valKeyDown = this.value;
    return integerOnly(event);
});

$('.integerOnly').keyup(function (event) {          //This is to protect if user copy-pastes some character value ,..
    valKeyUp = this.value;                          //In that case, pasted text is replaced with old value,
    if (!new RegExp('^[0-9]*$').test(valKeyUp)) {   //which is stored in 'valKeyDown' at keydown event.
        $(this).val(valKeyDown);                    //It is not possible to check this inside 'integerOnly' function as,
    }                                               //one cannot get the text printed by keydown event 
});                                                 //(that's why, this is checked on keyup)

$('.integerOnly').bind('input propertychange', function(e) {    //if user copy-pastes some character value using mouse
    valKeyUp = this.value;
    if (!new RegExp('^[0-9]*$').test(valKeyUp)) {
        $(this).val(valKeyDown);
    }
});

Answer 8

В настоящее время невозможно запретить пользователю записывать десятичные значения при вводе только с использованием HTML.Вы должны использовать JavaScript.

Answer 9

В Future ™ (см. Могу ли я использовать ) на пользовательских агентах, которые предоставляют вам клавиатуру, вы можете ограничить ввод текста только с помощью input[inputmode].