Существует ли приемлемый кросс-платформенный метод отображения цифровой клавиатуры в стандартных веб-формах на сенсорном устройстве?

Цель: найти кроссплатформенное решение для отображения цифровых клавиатур на мобильных сенсорных устройствах с минимумом взломов.

Проблема:

У меня есть обычное веб-приложение, использующее формы ввода данных, содержащие в основном числовые данные. Когда пользователь взаимодействует с моим сайтом на мобильном устройстве, я хотел бы отображать цифровую виртуальную клавиатуру, поскольку для большинства стандартных клавиатур требуется второе нажатие для переключения с букв на числа. Я знаю, что могу вызвать другую клавиатуру, установив атрибут "type" элемента ввода:

type=number: Отлично работает под iOS / Safari. Я не уверен в других браузерах на платформе.

На Android это не приводит к последовательному вызову правильной клавиатуры в различных браузерах и часто приводит к появлению нежелательных кнопок лифта при вводе. Мне еще предстоит найти чистый способ отключить их в CSS.

type=tel: Это почти работает в iOS / Safari, но на клавиатуре телефона отсутствует десятичная кнопка.

Кажется, отлично работает в нескольких браузерах Android, без каких-либо посторонних элементов пользовательского интерфейса, добавленных на страницу.

Мое текущее решение взломано и упрощено. На основе класса, который я уже использую для числовой проверки, я заменяю каждый текстовый элемент, который должен содержать число, новым вводом типа number или tel в зависимости от обнаруженной ОС / браузера.

var isAndroid = navigator.userAgent.match(/android/i) ? true : false;
var isIOS = navigator.userAgent.match(/(ipod|ipad|iphone)/i) ? true : false;

if (isAndroid || isIOS) {
    var useNumberType = (isIOS ? true : false); //iOS uses type=number, everyone else uses type=tel
    jQuery("input.num").each(function () {
        var type = (useNumberType ? "number" : "tel");
        var html = this.outerHTML;
        html = html.replace(/(type=\"?)text(\"?)/, "$1" + type + "$2");
        this.outerHTML = html;
    });
}

Я бы предпочел не использовать обнаружение браузера и не менять входные данные на лету во время выполнения. Я мог бы ввести http-модуль на стороне сервера, который делал бы в основном то же самое, но это не намного лучше. Я шокирован тем, что для этого нет вызова CSS.

Есть ли лучший способ получить цифровую клавиатуру с десятичной кнопкой, которая работает на всех или большинстве сенсорных мобильных устройств без добавления странных элементов пользовательского интерфейса на страницу?

-------------- Обновить

Я не думаю, что есть способ сделать то, что я действительно хочу делать, а именно настроить единый стиль или тип ввода, который будет хорошо работать в настольных браузерах и на всех основных мобильных платформах с сенсорным экраном. Я решил изменить тип ввода через прямой вызов DOM, а не через jQuery, вместо того, чтобы переписывать весь ввод через externalHTML. Я подозреваю, что в действительности нет большой разницы, но код немного чище. Поскольку я не меняю типы ввода на рабочем столе, мне не нужно беспокоиться об ограничении IE только на чтение для атрибута.

В идеале я бы, вероятно, справился с этим на стороне сервера, чтобы все было отправлено в браузер в формате, желаемом для устройства, выполняющего запрос. Но пока новый код выглядит примерно так:

var isAndroid = navigator.userAgent.match(/android/i) || navigator.platform.match(/android/i) ? true : false;
var isIOS = navigator.userAgent.match(/(ipod|ipad|iphone)/i) ? true : false;

if (isAndroid || isIOS) {
    var useNumberType = (isIOS ? true : false); //iOS uses type=number, everyone else uses type=tel
    jQuery("input.num").each(function () {
        var type = (useNumberType ? "number" : "tel");
        if (this.type == "text") {
            this.type = type;
        }
    });
}