autocapitalize

autocapitalize 全局属性enumerated 属性,用于控制输入的文本是否自动大写,如果是,则以何种方式自动大写。这与:

¥The autocapitalize global attribute is an enumerated attribute that controls whether inputted text is automatically capitalized and, if so, in what manner. This is relevant to:

autocapitalize 不会影响在物理键盘上键入时的行为。它会影响其他输入机制的行为,例如移动设备上的虚拟键盘和语音输入。这可以帮助用户更快、更轻松地输入数据,例如自动大写每个句子的第一个字母。

¥autocapitalize doesn't affect behavior when typing on a physical keyboard. It affects the behavior of other input mechanisms such as virtual keyboards on mobile devices and voice input. This can assist users by making data entry quicker and easier, for example by automatically capitalizing the first letter of each sentence.

¥Value

可能的值为:

¥Possible values are:

noneoff

不要自动将任何文本大写。

sentenceson

自动将每个句子的第一个字符大写。

words

自动将每个单词的第一个字符大写。

characters

自动将每个字符大写。

使用说明

¥Usage notes

  • 可以在 <input><textarea> 元素以及它们包含的 <form> 元素上设置 autocapitalize。当在 <form> 元素上设置 autocapitalize 时,它会为所有包含的 <input><textarea> 设置自动大写行为,从而覆盖在包含的元素上设置的任何 autocapitalize 值。
  • autocapitalizeurlemailpassword <input> 类型没有影响,这些类型从不启用自动大写。
  • 如果未指定 autocapitalize,则采用的默认行为因浏览器而异。例如:
    • Chrome 和 Safari 默认为 on/sentences
    • Firefox 默认为 off/none

示例

¥Examples

HTML

html
<p>Form to test different autocapitalize settings:</p>

<form>
  <div>
    <label for="default">Default: no autocapitalize set</label>
    <input type="text" id="default" name="default" />
  </div>
  <div>
    <label for="off">autocapitalize="off"</label>
    <input type="text" id="off" name="off" autocapitalize="off" />
  </div>
  <div>
    <label for="none">autocapitalize="none"</label>
    <input type="text" id="none" name="none" autocapitalize="none" />
  </div>
  <div>
    <label for="on">autocapitalize="on"</label>
    <input type="text" id="on" name="on" autocapitalize="on" />
  </div>
  <div>
    <label for="sentences">autocapitalize="sentences"</label>
    <input
      type="text"
      id="sentences"
      name="sentences"
      autocapitalize="sentences" />
  </div>
  <div>
    <label for="words">autocapitalize="words"</label>
    <input type="text" id="words" name="words" autocapitalize="words" />
  </div>
  <div>
    <label for="characters">autocapitalize="characters"</label>
    <input
      type="text"
      id="characters"
      name="characters"
      autocapitalize="characters" />
  </div>
  <div>
    <label for="characters-ta">autocapitalize="characters" on textarea</label>
    <textarea
      type="text"
      id="characters-ta"
      name="characters-ta"
      autocapitalize="characters">
    </textarea>
  </div>
</form>

<hr />

<p contenteditable autocapitalize="characters">
  This content is editable and has autocapitalize="characters" set on it
</p>
css
div {
  margin-bottom: 20px;
}

结果

¥Result

使用虚拟键盘或语音输入测试每个输入的效果(键盘输入不起作用)。

¥Test the effect on each input using a virtual keyboard or voice entry (keyboard entry will not work).

规范

Specification
HTML Standard
# attr-autocapitalize

¥Specifications

浏览器兼容性

BCD tables only load in the browser

¥Browser compatibility