手机扫一扫访问
inputmode（设置键盘的类型）
| 关键词 | 描述 |
|---|---|
none | 不显示键盘，需要实现自己的键盘输入控件时很有用（比如车牌输入，身份证号码输入等）。 |
text | 标准文本输入键盘。 |
tel | 显示一个能够输入电话号码的虚拟键盘。这应该包括数字 0 到 9、“#”字符和“*”字符的键。在某些地区，这还可以包括字母助记符标签（例如，在美国，标记为“2”的键在历史上也标有字母 A、B 和 C）。 |
url | 显示一个虚拟键盘，能够在用户的语言环境中输入文本，并带有用于帮助输入URL的键，例如“/”和“.”。字符和快速输入域名中常见的字符串，例如“www”。或“.com”。 |
email | 用户代理应该显示一个虚拟键盘，能够在用户的区域设置中输入文本，并带有用于帮助输入电子邮件地址的键，例如“@”字符和“.”。特点。 |
numeric | 显示一个能够进行数字输入的虚拟键盘。此关键字对于 PIN 输入很有用。 |
decimal | 显示一个能够输入小数的虚拟键盘。应显示数字键和区域设置的格式分隔符。 |
search | 显示一个针对搜索优化的虚拟键盘。 |
<form>
<input placeholder="focus me,不使用键盘" inputmode="none" required>
</form>
<form>
<input placeholder="focus me,小数键盘" inputmode="decimal" required>
</form>
<form>
<input placeholder="focus me,数字键盘" inputmode="numeric" required>
</form>
<form>
<input placeholder="focus me,手机号键盘" inputmode="tel" required>
</form>
<form>
<input placeholder="focus me,搜索键盘" inputmode="search" required>
</form>
<form>
<input placeholder="focus me,email键盘" inputmode="email" required>
</form>
<form>
<input placeholder="focus me,url键盘" inputmode="url" required>
</form>
enterkeyhint（设置键盘enter键）
| 关键词 | 描述 |
|---|---|
done | 完成 |
go | 前往 |
search | 搜索 |
send | 发送 |
next | 下一项 |
enter | 向下换行 |
previous | 向上换行 |
<form>
<input placeholder="focus me,完成" enterkeyhint="done" required>
</form>
<form>
<input placeholder="focus me,前往" enterkeyhint="go" required>
</form>
<form>
<input placeholder="focus me,搜索" enterkeyhint="search" required>
</form>
<form>
<input placeholder="focus me,发送" enterkeyhint="send" required>
</form>
<form>
<input placeholder="focus me,下一项" enterkeyhint="next" required>
</form>
<form>
<textarea placeholder="focus me,换行，向下换行" rows="2" enterkeyhint="enter" required></textarea>
</form>
<form>
<textarea placeholder="focus me,换行，向上换行" rows="2" enterkeyhint="previous" required></textarea>
</form>
type
<form>
<input type="text" placeholder="focus me,text">
</form>
<form>
<input type="tel" placeholder="focus me,tel">
</form>
<form>
<input type="email" placeholder="focus me,email">
</form>
<form>
<input type="url" placeholder="focus me,url">
</form>
pattern
<form>
<input placeholder="focus me,[0-9]*" pattern="[0-9]*" required>
</form>
<form>
<input placeholder="focus me,\d*" pattern="\d*" required>
</form>
问题
1、input已经有了type为什还要有inputmode？
首先
inputmode是大于type的，比如一个输入框明明是个数字输入框，但偏偏设置一个type="text"这时候就可以设置inputmode="numeric"。 还有有的inputmode属性是type不具备的，比如：inputmode="none"inputmode="decimal"
