HTML |<input> 接受属性

在 HTML 中，<input> 元素被用来创建各种表单元素，比如文本框，复选框，单选框和按钮等等。 <input> 元素可以接受多种属性，用以设置元素的行为和外观。

常用属性

以下是一些常见的 <input> 属性：

type 属性

这个属性用于设置输入框的类型。常见的类型有：

• text：文本输入框（默认类型）
• password：密码输入框
• email: 邮箱输入框
• number：数字输入框
• checkbox：复选框
• radio：单选框
• submit：提交按钮
• reset：重置按钮

<input type="text" name="username">
<input type="password" name="password">
<input type="email" name="email">
<input type="number" name="age">
<input type="checkbox" name="checkbox">
<input type="radio" name="checkbox">
<input type="submit" value="提交">
<input type="reset" value="重置">

name 属性

这个属性用于在表单中区分不同的输入框。当表单提交时，会将输入框的名称与输入框的值一起发送到服务器。

<input type="text" name="username">
<input type="password" name="password">
<input type="submit" value="提交">

placeholder 属性

这个属性用于在输入框未填写时，显示一个提示。当用户开始输入时，提示文字会自动消失。

<input type="text" name="username" placeholder="请填写用户名">

readonly 和 disabled 属性

这两个属性都可以使输入框变为不可编辑状态，区别在于：

• readonly 可以通过键盘输入改变值，但不能通过鼠标改变
• disabled 既不能通过键盘输入，也不能通过鼠标改变值

<input type="text" name="username" readonly value="只读">
<input type="text" name="username" disabled value="禁用">

required 属性

这个属性用于设置输入框为必填项。如果用户未填写这个输入框，表单将无法提交。

<input type="text" name="username" required>

autofocus 属性

这个属性用于设置输入框自动获得焦点。当页面加载完成后，输入框将自动获得焦点。

<input type="text" name="username" autofocus>

结论

<input> 可以接受许多属性，使用这些属性可以将输入框定制成符合特定需求的形式。以上是几个常见的 <input> 属性，更多信息可以查阅 MDN 文档 。