AMP

AMP 中现在支持表单

未分类

我们刚刚在 AMP HTML 中推出了对表单的支持。使用“amp-form”扩展,<form> 元素及其相关元素(如 <input>)可用于在 AMP 文档中构建表单。这使得构建体验成为可能,从电子商务详情页面上的产品颜色选择器到用于获取时事通讯注册的电子邮件字段,再到用于吸引文章中读者的互动投票。

常规导航和 XHR(XMLHttpRequest,又名 Ajax)表单提交均受支持,但 请查阅文档以了解有关实现要求的更多详细信息。此外,amp-form 暴露出多项功能,以改善填写表单的体验:

  • 使用 “on” 属性在提交表单时更改页面,或根据表单是成功提交还是出错来更改页面。
  • 通过使用模板化响应呈现对提交的字段进行注释。使用此功能对字段输入的错误之处提供上下文反馈。
  • 使用 CSS 伪类根据验证状态设置字段样式,以便向用户提供有关其输入是否有效的实时反馈。
模板化响应呈现的一个 示例。一旦提交表单(在本例中,出现错误),你可以返回一条带有有用消息的响应。

要开始使用,请查看 文档AMP By Example 中的示例

我们希望听到您对其他有用功能的看法,因为我们计划很快扩展表单的功能。例如,自定义验证现在作为实验性功能(“amp-form-custom-validations”)提供。进一步的验证支持和条件行为只是我们在AMP 路线图中跟踪的增强功能的两个示例。

有了这组初始表单支持,我们期待看到开发者构建的所有出色的支持表单的体验。

AMP 项目产品经理 Rudy Galfi 发布