17370845950

required属性用于设置表单字段为必填项，浏览器自动验证非空后才允许提交。支持该属性的元素包括文本框、密码框、邮箱、数字输入、下拉框（默认选项为空）和文本域。示例中注册表单的姓名、邮箱、密码、性别和简介均设为必填，用户未填写时浏览器会提示并聚焦首个错误字段。注意事项：前端验证需配合服务器端校验；hidden类型不适用；radio按钮通过name分组实现单选必填，checkbox单独设置表示必须勾选；IE9及以下不支持，需JS辅助验证。合理使用可提升表单填写规范性与效率。

在HTML表单中，required 属性用于指定某个输入字段在提交表单前必须填写，也就是设置为必填项。浏览器会自动验证这些字段，如果为空则阻止表单提交，并提示用户输入内容。

1. required属性的基本语法

只需要在支持该属性的表单元素上添加 required 即可。这是一个布尔属性，不需要赋值。

上面的代码表示用户名输入框是必填项。

2. 常见支持required的表单元素

以下常用的表单控件都可以使用 required 属性：

立即学习“前端免费学习笔记（深入）”；

• 文本框：
• 密码框：
• 邮箱：
• 数字：
• 下拉选择框（需默认选项为空）：

  
    请选择城市
    北京
    上海
  

• 文本域：

3. 实际使用示例

一个包含多个必填项的注册表单示例：

  姓名：


  邮箱：


  密码：


  
    性别：
    
      请选择
      男
      女
    
  


  简介：


  提交

当用户尝试提交但未填写任一 required 字段时，浏览器会弹出提示，焦点会定位到第一个未填写的必填项。

4. 注意事项与兼容性

使用 required 属性时需要注意以下几点：

• 仅靠前端验证不能保证数据安全，服务器端仍需进行校验。
• 不是所有 input 类型都支持 required，比如 type="hidden" 通常不适用。
• 对于 radio 按钮 和 checkbox，用法略有不同：
  • 多个 radio 中只要有一个设置了 required，并选中组名（name），整个组视为必选。
  • Checkbox 可单独设置 required，表示必须勾选（如同意协议）。
• 现代主流浏览器都支持 required 属性，但在非常旧的浏览器（如 IE9 及以下）中不被识别，需要 JavaScript 补充验证。

基本上就这些。合理使用 required 属性能提升用户体验，让表单填写更规范、高效。