在此页

• 可访问性关注
• 范例
• 规范
• 浏览器兼容性
• 另请参阅
• 相关话题

The Boolean required 属性 which, if present, indicates that the user must specify a value for the input before the owning form can be submitted. The required attribute is supported by text , search , url , tel , email , password , date , month , week , time , datetime-local , number , checkbox , radio , file , <input> types along with the <select> and <textarea> form control elements. If present on any of these input types and elements, the :required pseudo class will match. If the attribute is not included, the :optional pseudo class will match.

The attribute is not supported or relevant to range and color , as both have default values. It is also not supported on hidden as it can not be expected that a user to fill out a form that is hidden. Nor is it supported on any of the button types, including image .

注意 color and range don't support required , but type color 默认为 #000000 ，和 range defaults to the midpoint between min and max -- with min and max defaulting to 0 and 100 respectively in most browsers if not declared -- so always has a value.

When an input has the required attribute, the :required pseudo-class also applies to it. Conversely, inputs that support the required attribute but don't have the attribute set match the :optional pseudo-class.

In the case of a same named group of radio buttons, if a single radio button in the group has the required attribute, a radio button in that group must be checked, although it doesn't have to be the one with the attribute is applied. So to improve code maintenance, it is recommended to either include the required attribute in every same-named radio button in the group, or else in none.

In the case of a same named group of checkbox input types, only the checkboxes with the required attribute are required.

Note: Setting aria-required ="true" tells a screen reader that an element (any element) is required, but has no bearing on the optionality of the element.

Attribute interactions

Because a read-only field cannot have a value, required does not have any effect on inputs with the readonly attribute also specified.

Usability

When including the required attribute, provide a visible indication near the control informing the user that the <input> , <select> or <textarea> is required. In addition, target required form controls with the :required pseudo-class, styling them in a way to indicate they are required. This improves usability for sighted users. Assistive technology should inform the user that the form control in mandatory based on the required attribute, but adding aria-required ="true" doesn't hurt, in case the browser / screen reader combination does not support required yet.

Constraint validation

If the element is required and the element's value is the empty string, then the element is suffering from valueMissing and the element will match the :invalid pseudo class.

可访问性关注

Provide an indication to users informing them the form control is required. Ensure the messaging is multi-faceted, such as thru text, color, markings, and attribute, so that all users understand the requirements whether they have color blindness, cognitive differences, or are using a screen reader.

范例

HTML

<form>
  <div class="group">
    <input type="text">
    <label>Normal</label>
  </div>
  <div class="group">
    <input type="text" required="required">
    <label>Required</label>
  </div>
  <input type="submit">
</form>
					

结果

规范

规范	状态	注释
HTML 实时标准 The definition of 'required attribute' in that specification.	实时标准
HTML5 The definition of 'required attribute' in that specification.	推荐
HTML 5.1 The definition of 'required attribute' in that specification.	推荐

浏览器兼容性

The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.

No compatibility data found. Please contribute data for "html.elements.attributes.required" (depth: 1) to the MDN 兼容性数据存储库 .

另请参阅

• validitystate.valuemissing
• :required and :optional
• <input>
• <select>

元数据

• 最后修改： 2020 年 11 月 9 日

相关话题

1. HTML
2. 教程：
3. HTML 基础
4. HTML 介绍

   1. Introduction to HTML overview
   2. Getting started with HTML
   3. What's in the head? Metadata in HTML
   4. HTML text fundamentals
   5. Creating hyperlinks
   6. Advanced text formatting
   7. Document and website structure
   8. Debugging HTML
   9. Assessment: Marking up a letter
   10. Assessment: Structuring a page of content
5. 多媒体和嵌入

   1. Multimedia and embedding overview
   2. Images in HTML
   3. Video and audio content
   4. From object to iframe — other embedding technologies
   5. Adding vector graphics to the Web
   6. Responsive images
   7. Assessment: Mozilla splash page
6. 参考：
7. HTML 元素

   1. <a>
   2. <abbr>
   3. <acronym>
   4. <address>
   5. <applet>
   6. <area>
   7. <article>
   8. <aside>
   9. <audio>
   10. <b>
   11. <base>
   12. <basefont>
   13. <bdi>
   14. <bdo>
   15. <bgsound>
   16. <big>
   17. <blink>
   18. <blockquote>
   19. <body>
   20. <br>
   21. <button>
   22. <canvas>
   23. <caption>
   24. <center>
   25. <cite>
   26. <code>
   27. <col>
   28. <colgroup>
   29. <command>
   30. <content>
   31. <data>
   32. <datalist>
   33. <dd>
   34. <del>
   35. <details>
   36. <dfn>
   37. <dialog>
   38. <dir>
   39. <div>
   40. <dl>
   41. <dt>
   42. <element>
   43. <em>
   44. <embed>
   45. <fieldset>
   46. <figcaption>
   47. <figure>
   48. <font>
   49. <footer>
   50. <form>
   51. <frame>
   52. <frameset>
   53. <h1>
   54. <head>
   55. <header>
   56. <hgroup>
   57. <hr>
   58. <html>
   59. <i>
   60. <iframe>
   61. <image>
   62. <img>
   63. <input>
   64. <ins>
   65. <isindex>
   66. <kbd>
   67. <keygen>
   68. <label>
   69. <legend>
   70. <li>
   71. <link>
   72. <listing>
   73. <main>
   74. <map>
   75. <mark>
   76. <marquee>
   77. <menu>
   78. <menuitem>
   79. <meta>
   80. <meter>
   81. <multicol>
   82. <nav>
   83. <nextid>
   84. <nobr>
   85. <noembed>
   86. <noframes>
   87. <noscript>
   88. <object>
   89. <ol>
   90. <optgroup>
   91. <option>
   92. <output>
   93. <p>
   94. <param>
   95. <picture>
   96. <plaintext>
   97. <pre>
   98. <progress>
   99. <q>
   100. <rb>
   101. <rp>
   102. <rt>
   103. <rtc>
   104. <ruby>
   105. <s>
   106. <samp>
   107. <script>
   108. <section>
   109. <select>
   110. <shadow>
   111. <slot>
   112. <small>
   113. <source>
   114. <spacer>
   115. <span>
   116. <strike>
   117. <strong>
   118. <style>
   119. <sub>
   120. <summary>
   121. <sup>
   122. <table>
   123. <tbody>
   124. <td>
   125. <template>
   126. <textarea>
   127. <tfoot>
   128. <th>
   129. <thead>
   130. <time>
   131. <title>
   132. <tr>
   133. <track>
   134. <tt>
   135. <u>
   136. <ul>
   137. <var>
   138. <video>
   139. <wbr>
   140. <xmp>
8. 全局属性

   1. accesskey
   2. autocapitalize
   3. class
   4. contenteditable
   5. contextmenu
   6. data-*
   7. dir
   8. draggable
   9. dropzone
   10. hidden
   11. id
   12. inputmode
   13. is
   14. itemid
   15. itemprop
   16. itemref
   17. itemscope
   18. itemtype
   19. lang
   20. part
   21. slot
   22. spellcheck
   23. style
   24. tabindex
   25. title
   26. translate
   27. x-ms-acceleratorkey
   28. x-ms-format-detection
9. <input> 类型

   1. <input type="button">
   2. <input type="checkbox">
   3. <input type="color">
   4. <input type="date">
   5. <input type="datetime">
   6. <input type="datetime-local">
   7. <input type="email">
   8. <input type="file">
   9. <input type="hidden">
   10. <input type="image">
   11. <input type="month">
   12. <input type="number">
   13. <input type="password">
   14. <input type="radio">
   15. <input type="range">
   16. <input type="reset">
   17. <input type="search">
   18. <input type="submit">
   19. <input type="tel">
   20. <input type="text">
   21. <input type="time">
   22. <input type="url">
   23. <input type="week">
10. 文档编制：
11. 有用清单

    All pages index

    Pages tagged "HTML"
12. 贡献

    1. HTML 文档状态
    2. MDN 工程