HTML autofocus 属性

带有 autofocus 属性的 HTML 元素指示该属性或标签在页面加载时立即获得焦点。当一个控件获得焦点时，文本输入将被导向 autofocus。一个页面上只能有一个 autofocus 元素。<textarea>、<button>、<select> 以及 <input> 元素都支持 autofocus 功能。一个页面上只能有一个获得焦点的元素。因此，autofocus 属性在每个页面上只应用于一个元素。

语法

以下语法显示了用户交互标签中的 autofocus 关键字。

注意：我们可以为重要元素的用例如户交互使用 autofocus。

示例

以下示例显示了表单不同元素的 autofocus。

示例 1

以下示例显示了 input 标签的 autofocus 属性。我们可以为表单的第一个元素使用 autofocus。

输出

输出显示了 html autofocus 属性的元素。

示例 2

以下示例显示了所有 input 标签的 autofocus 属性。我们可以为表单的文本和日期元素使用 autofocus。autofocus 会作用于表单的第一个标签，对于其他标签则无效。

输出

输出显示了 html autofocus 属性的元素。

示例 3

以下示例显示了 textarea 标签的 autofocus 属性。我们不能为表单的 input 和 date 元素使用 autofocus。

输出

输出显示了 html autofocus 属性的元素。

示例 4

以下示例显示了 input submit 按钮的 autofocus 属性。我们可以为表单的最后一个元素使用 autofocus。

输出

输出显示了 html autofocus 属性的元素。

结论

autofocus 属性用于创建吸引人的 html 表单。我们可以为用户交互创建优雅且引人注目的表单。