如何在Android手机网站强制使用数字键盘

我有一个移动网站,它有一些HTML input元素,就像这样:

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

我已经将该网站embedded到可能的Android 2.1消费的WebView中,以便它也将是一个Android应用程序。

当这个HTML input元素被关注时,是否可以用数字而不是默认的字母来获得键盘?

或者,是否有可能为整个应用程序(可能是Manifest文件中的某些东西)设置它,如果它不适用于HTML元素?

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

当input获得焦点时,这两个都会显示数字键盘。

<input type="search" />显示带有额外searchbutton的普通键盘

一切似乎都提出了标准的键盘。

重要的提示

我发布这个答案,而不是一个评论,因为这是相当重要的信息,它会吸引更多的关注在这种格式。

正如其他人指出的,你可以强迫一个设备向你展示一个type="number" / type="tel"的数字键盘,但是我必须强调你必须对此非常谨慎。

如果有人期望一个以零开头的数字,比如000222 ,那么她可能会遇到麻烦,因为有些浏览器(例如桌面版Chrome)会发送到服务器222 ,这不是她想要的。

关于type="tel"我不能说任何类似的东西,但我个人并不使用它,因为它在不同的电话上的行为可能会有所不同。 我只局限于简单pattern="[0-9]*" ,这在Android中不起作用

这应该工作。 但是我在Android手机上遇到同样的问题。

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

我发现,如果我没有包括jquerymobile框架,键盘显示正确的两种types的领域。

但是,如果你真的需要使用jquerymobile,我还没有find解决这个问题的解决scheme。

更新:我发现,如果窗体标签存储在

 <div data-role="page"> 

数字键盘没有显示。 这一定是一个错误…

当inputtypes为“数字”时,一些浏览器igoners向服务器发送前导零。 所以我使用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添加一个步骤属性

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

资料来源: http : //blog.pamelafox.org/2012/05/triggering-numeric-keyboards-with-html5.html

input type = number

当您要提供数字input时,可以使用HTML5inputtypes=“数字”属性值。

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

这是iPhone 4上的键盘:

HTML5inputtypes号的iPhone屏幕截图Android 2.2使用此键盘inputtype = number:

HTML5inputtypes编号的Android屏幕截图