inputmode 是一个 HTML 属性，用于指定用户在编辑元素或其内容时应使用的虚拟键盘布局类型。它主要影响移动设备和平板电脑的输入体验。
语法
<input inputmode="value">
<!-- 或 -->
<textarea inputmode="value"></textarea>
<!-- 或 -->
<div contenteditable="true" inputmode="value"></div>属性值
| 值 | 描述 | 适用场景 |
|---|---|---|
none | 不显示虚拟键盘 | 当输入由自定义键盘控制时 |
text | 默认文本键盘 | 通用文本输入 |
decimal | 数字键盘，可能包含小数点和负号 | 数字输入，特别是小数 |
numeric | 纯数字键盘 | 电话号码、验证码等 |
tel | 电话号码键盘（通常包含*和#） | 电话号码输入 |
search | 优化的搜索键盘（可能有搜索按钮） | 搜索框 |
email | 优化的电子邮件键盘（通常包含@和.） | 电子邮件地址输入 |
url | 优化的URL键盘（通常包含/和.com按钮） | 网址输入 |
示例
<!-- 数字输入 -->
<input type="text" inputmode="numeric" pattern="[0-9]*" placeholder="请输入验证码"><!-- 电子邮件输入 -->
<input type="text" inputmode="email" placeholder="请输入邮箱"><!-- 电话号码输入 -->
<input type="tel" inputmode="tel" placeholder="请输入电话号码"><!-- 搜索框 -->
<input type="search" inputmode="search" placeholder="搜索...">注意事项
-
inputmode不是验证工具，仍需使用pattern或 JavaScript 进行输入验证 -
不同浏览器和设备对
inputmode的实现可能略有差异 -
对于
contenteditable元素，某些浏览器可能不完全支持 -
可以与其他输入属性（如
pattern、maxlength）结合使用
浏览器支持
大多数现代浏览器（包括移动浏览器）都支持 inputmode 属性，但在使用时最好进行兼容性测试。
)
