在基于HTML5 的 jQuery Mobile 框架中,常用的输入框列表如下。
名称 | Type | 功能 |
文本输入框 | text | 传统输入框,实现文本输入 |
密码输入框 | password | 输入密码的输入框,相当于<input. type="password"/>的功能 |
数字输入框 | number | 能够输入数字的输入框。与html4不同之处在于,可以通过微调按钮的样式进行上下调整 |
电子邮件输入框 | 能够输入电子邮件,在部分浏览器,如Google Chrome,能够从之前输入过的电子邮件中进行匹配并自动提示可能的电子邮件地址。 | |
URL输入框 | url | 支持输入U R L 地址。在部分浏览器,如Google Chrome,能够从之前输入过的地址中进行匹配并自动提示可能的电子邮件地址。 |
电话号码输入框 | tel | 支持输入电话号码。在部分浏览子输入中,对此进行特别的优化设计 |
时间输入框 | time | 支持输入时间。与HTML4 不同之处在于,可以通过微调按钮的样式进行上下调整。 |
日期输入框 | date | 支持输入日期。与HTML4 不同之处在于,可以通过微调按钮的样式进行上下调整。 |
月份输入框 | month | 支持输入月份。与HTML4 不同之处在于,可以通过微调按钮的样式进行上下调整。 |
周输入框 | week | 显示年份,以及相关时间在所在年份的周数。例如2011-W41,表示2011 年第41 周。与HTML4 不同之处在于,可以通过微调按钮的样式进行上下调整。 |
时间日期输入框 | datetime | 日期与时间,时区为UTC 时间。与HTML4 不同之处在于,可以通过微调按钮的样式进行上下调整。 |
本地时间日期输入框 | datetime-local | 本地时区之下的日期和时间。与HTML4 不同之处在于,可以通过微调按钮的样式进行上下调整。 |
色彩输入框 | color | 支持输入色彩值 |
查询框 | search | 具有查询图标的输入框。 |
输入框部分代码原型如下,
<div data-role=”fieldcontain”>
<label for=”name”> 文本输入框:</label>
<input type=”text” name=”name” id=”name” value=””/>
</div>