Как заставить клавиатуру с цифрами на мобильном сайте в Android

У меня есть мобильный сайт, и в нем есть некоторые элементы input HTML, например:

 <input type="text" name="txtAccessoryCost" size="6" /> 

Я WebView сайт в WebView для возможного потребления Android 2.1, так что это будет также приложение для Android.

Возможно ли получить клавиатуру с числами вместо стандартного с буквами, когда этот элемент input HTML сфокусирован?

Или, возможно ли установить его для всего приложения (может быть, что-то в файле манифеста ), если это невозможно для HTML-элемента?

 <input type="number" /> <input type="tel" /> 

Оба они представляют собой цифровую клавиатуру, когда фокус фокуса входа.

<input type="search" /> показывает обычную клавиатуру с дополнительной кнопкой поиска

Все остальное, похоже, вызывает стандартную клавиатуру.

ВАЖНАЯ ЗАМЕТКА

Я размещаю это как ответ, а не комментарий, так как это довольно важная информация, и он привлечет больше внимания в этом формате.

Как указывали другие ребята, вы можете заставить устройство показать вам цифровую клавиатуру с type="number" / type="tel" , но я должен подчеркнуть, что вы должны быть крайне осторожны с этим.

Если кто-то ожидает число, начинающееся с нулей, например 000222 , то у нее могут возникнуть проблемы, так как некоторые браузеры (например, настольный Chrome) отправят на сервер 222 , чего она не хочет.

О type="tel" Я не могу сказать ничего подобного, но лично я его не использую, поскольку его поведение на разных телефонах может меняться. Я ограничился простым pattern="[0-9]*" который не работает в Android

Это должно сработать. Но у меня такие же проблемы на телефоне Android.

 <input type="number" /> <input type="tel" /> 

Я узнал, что если бы я не включил jquerymobile-framework, клавиатура правильно отображалась на двух типах полей.

Но я не нашел решения для решения этой проблемы, если вам действительно нужно использовать jquerymobile.

ОБНОВЛЕНИЕ: Я узнал, что если тэг формы хранится из

 <div data-role="page"> 

Цифровая клавиатура не отображается. Это должно быть ошибка …

Добавьте атрибут шага к вводу номера

 <input type="number" step="0.01"> 

Источник: http://blog.pamelafox.org/2012/05/triggering-numeric-keyboards-with-html5.html

Некоторые браузеры, которые отправляют ведущий нуль на сервер, когда тип ввода является «числом». Поэтому я использую смешение jquery и html для загрузки цифровой клавиатуры, а также убедитесь, что значение отправлено как текст не как число:

 $(document).ready(function(){ $(".numberonly").focus(function(){$(this).attr("type","number")}); $(".numberonly").blur(function(){$(this).attr("type","text")}); }) 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <input type="text" class="numberonly"> 

input type = number

Если вы хотите указать ввод номера, вы можете использовать значение атрибута ввода HTML5 = «число».

 <input type="number" name="n" /> 

Вот клавиатура, которая появляется на iPhone 4:

IPhone Скриншот номера ввода типа HTML5 Android 2.2 использует эту клавиатуру для type = number:

Android Скриншот номера типа ввода HTML5