什么是 Web 表单 2.0?
HTML 表单是网页的特殊部分,包含某些控件,包括标签、文本字段、密码字段、隐藏字段(由软件使用)、单选按钮、复选框、字段集、图例和提交按钮。在与这些表单交互期间,用户提供所有必要的信息供服务器处理。目前,客户端脚本用于效果和简单验证(通常使用 Javascript),但 HTML5 将在不久的将来大幅减少对这方面的需求。
许多浏览器都支持 HTML5 表单元素,尽管其中一些在兼容性和显示功能上有所不同。本文探讨了 HTML5 网站表单的主要组件以及旨在使 HTML 更加用户友好的新功能。
HTML5 输入元素(文本):
电子邮件:它只接受电子邮件值。需要包含电子邮件地址的输入字段应使用此类型。当您尝试提交简单的文本时,它只会要求您提供格式为 email@example.com 的电子邮件地址。
例子:
HTML
HTML
HTML
HTML
HTML
HTML
HTML
HTML
HTML
HTML
HTML
Example of HTML output Tag
HTML
HTML
HTML
输出:
数字:此字段仅接受数值。 step 属性指定精度,默认为 1。
例子:
HTML
输出:
时间:时间(小时、分钟、秒、小数秒)根据 ISO 8601 编码。
例子:
HTML
输出:
周:由工作日和年份组成的日期根据 ISO 8061 进行编码。
例子:
HTML
输出:
月:根据 ISO 8061,对由年和月组成的日期进行编码。
例子:
HTML
输出:
日期:日期(年、月、日)使用 ISO 8601 标准进行编码。
例子:
HTML
输出:
datetime-local:以 ISO 8601 编码的日期和时间(年、月、日、小时、分钟、秒、秒的小数部分),没有时区信息。
例子:
HTML
输出:
周:下拉日历允许用户从周输入类型中选择周和年。
例子:
HTML
输出:
range:对于输入字段,范围类型用于表示值的范围。
例子:
HTML
输出:
URL:它只能接受 URL 值。在此类字段中,应输入 URL 地址。提交简单文本条目的人必须指定 URL,http://www.example.com 或 http://example.com
例子:
HTML
输出:
<输出>元素:
- HTML5 引入了一个名为
- 属性的输出元素用于指定该元素与文档中影响计算的其他元素之间的关系。
- 其他元素的 ID 的空格分隔列表是此属性的值。
例子:
HTML
Example of HTML output Tag
输出:
Web Form2.0 属性:
1.占位符属性
- HTML5 引入了一个名为 placeholder 的新属性。
- 通过 和
- 占位符文本不能包含换行符或回车符。
例子:
HTML
2.自动对焦属性
- 这是一个简单的一步式模式,可以在文档加载后立即在 JavaScript 中轻松编程。当表单加载时,它会自动关注文档中的特定字段。
例子:
HTML
3. 必需属性:
- required 属性用于代替 Javascript 验证。
- 由于这个属性,Javascript 现在只需要用于无法提交空文本框的客户端验证。
例子:
HTML