有没有办法强制数字键盘出现在电话<input type="text">?我刚刚意识到,<input type="number">在HTML5中是“浮点数”,所以它不适合信用卡号,邮政编码等。

我想模拟<input type="number">的数字键盘功能,用于接受浮点数以外的数值的输入。是否有其他合适的输入类型可以做到这一点?


当前回答

试试这个:

$(document).ready(function() {
    $(document).find('input[type=number]').attr('type', 'tel');
});

参见:https://answers.laserfiche.com/questions/88002/Use-number-field-input-type-with-Field-Mask

其他回答

使用type="email"或type="url"至少在某些手机上可以给你一个键盘,比如iPhone。对于电话号码,你可以使用type="tel"。

我认为type="number"对于语义网页来说是最好的。如果你只是想改变键盘,你可以使用type="number"或type="tel"。在这两种情况下,iPhone都不限制用户输入。用户仍然可以输入(或粘贴)任何他/她想要的字符。唯一的变化是显示给用户的键盘。如果您希望在此之外有任何限制,则需要使用JavaScript。

在2015年年中,我认为这是最好的解决方案:

<input type="number" pattern="[0-9]*" inputmode="numeric">

这将给你在Android和iOS上的数字键盘:

它还为您提供了预期的桌面行为,向上/向下箭头按钮和键盘友好的向上/向下箭头键递增:

试试下面的代码片段:

< >形式 <input type="number" pattern="[0-9]*" inputmode="numeric"> <按钮类型=“提交”> > < /按钮提交 > < /形式

通过结合type="number"和pattern="[0-9]*,我们得到了一个适用于任何地方的解决方案。并且,它向前兼容未来HTML 5.1提出的inputmode属性。

注意:使用模式将触发浏览器的原生表单验证。可以使用novalidate属性禁用此功能,也可以使用title属性自定义验证失败的错误消息。


如果您需要能够输入前导零、逗号或字母(例如,国际邮政编码),请检查这个轻微的变体。


致谢及进一步阅读:

http://www.smashingmagazine.com/2015/05/form-inputs-browser-support-issue/ http://danielfriesen.name/blog/2013/09/19/input-type-number-and-ios-numeric-keypad/

试试这个:

$(document).ready(function() {
    $(document).find('input[type=number]').attr('type', 'tel');
});

参见:https://answers.laserfiche.com/questions/88002/Use-number-field-input-type-with-Field-Mask

2018年:

<input type="number" pattern="\d*">

Android和iOS都适用。

我在Android(^4.2)和iOS(11.3)上进行了测试