• 首页
  • vue
  • TypeScript
  • JavaScript
  • scss
  • css3
  • html5
  • php
  • MySQL
  • redis
  • jQuery
  • <textarea>

    HTML<textarea>元素表示一个多行纯文本编辑控件。

    浏览器支持

    所有主流浏览器都支持<textarea>标签。

    例子

    <textarea rows="3" cols="30">
    这里是文本域中的文本 ... ... ... ...
    </textarea>
    

    标签定义及使用说明

    • <textarea>标签定义一个多行的文本输入控件。用户可在此文本区域中写文本。文本区域中可容纳无限数量的文本,其中的文本的默认字体是等宽字体(通常是 Courier)。
    • 可以通过 cols 和 rows 属性来规定<textarea>的尺寸大小,不过更好的办法是使用 CSS 的 height 和 width 属性。
    内存形式流式内容元素,段落内容元素,交互内容元素, listed, labelable, resettable, and submittable form-associated element.
    合法内容Text
    标签省略不允许,开始标签和结束标签都不能省略。
    合法父级可接受的任何元素段落内容元素.
    Permitted ARIA rolesNone
    DOM 接口HTMLTextAreaElement

    属性

    属性描述45
    autofocus
    • true
    • false
    在页面加载时,使这个 textarea 获得焦点。5
    colsnumber规定文本区内可见的列数。45
    disabled
    • true
    • false
    当此文本区首次加载时禁用此文本区。45
    form
    • true
    • false
    定义该 textarea 所属的一个或多个表单。5
    inputmodeinputmode定义该 textarea 所期望的输入类型。5
    namename_of_textarea为此文本区规定的一个名称。45
    readonly
    • true
    • false
    指示用户无法修改文本区内的内容。45
    required
    • true
    • false
    定义为了提交该表单,该 textarea 的值是否是必需的。5
    rowsnumber规定文本区内可见的行数。45

    这个元素包含了全局属性。

    • autocapitalizeiOS的非标准属性(iOS上的Safari。Firefox,Chrome都支持),文本是否自动首字母大写。在iOS5和之后的版本上有效。可能的值为:
      • none:禁用首字母大写。
      • sentences:句子的首字母大写。
      • words:单词或者字母的首字母大写。
      • characters:全部大写。
      • on:自iOS 5废弃。
      • off:自iOS 5废弃。
    • autocompleteHTML5新增是否使用浏览器的记忆功能自动填充文本。可能的值有:
      • off:不使用浏览器的记忆自动填充,使用者必须输入他们想要输入的所有内容。或者网页提供了自己的自动填充方法。
      • on:浏览器根据用户之前输入的内容或者习惯,在用户输入的时候给出相应输入提示。

      如果不指明autocomplete属性,浏览器会从父级的表单元素上解析是不是开启这个属性。表单元素可以是`textarea`元素的父级<form>或者`textarea`有跟表单相同的id(参见下面的form属性)。更多请查看<form>autocomplete属性。

    • autofocusHTML5新增页面加载完毕之后是否自动给本元素添加焦点。只有跟表格关联的才能使本属性生效。
    • cols文本域的可视宽度。必须为正数,默认为20(HTML5)。
    • disabled禁用文本域。默认为false。如果未指定,也可以从父级上如<fieldset>继承而来。
    • formHTML5新增指定跟自身相关联的表单。值必须为本文档内的表单的ID,如果未指定,就是跟当前所在的表单元素相关联。这就允许你在文档的任意地方放置文本域元素。
    • maxlengthHTML5新增允许用户输入的最大字符长度(Unicode)。未指定表示无限长度。
    • minlengthHTML5新增允许用户输入的最小字符长度(Unicode)
    • name元素的名称。
    • placeholderHTML5新增向用户提示可以在控件中输入的内容。在渲染提示时,占位符文本中的回车符(r)或换行符(n)一定会被作为行断(换行)处理。
    • readonly不允许用户修改元素内文本。和disabled属性不同的是,这个能让用户点击和选择元素内的文本。如果在表单里,这个元素的值还是会跟随表单一起提交。
    • requiredHTML5新增提示用户这个元素的内容必填。
    • rows元素的输入文本的行数(显示的高度)。
    • selectionDirectionHTML5新增The direction in which selection occurred. This is "forward" if the selection was made from left-to-right in an LTR locale or right-to-left in an RTL locale, or "backward" if the selection was made in the opposite direction. This can be "none" if the selection direction is unknown.
    • selectionEnd当前选中的最后一个字符的位置索引。
    • selectionStart当前选中的第一个字符的位置索引。
    • spellcheckHTML5新增该属性设为true时,表明该元素会做拼写和语法检查。属性值为default时,表明元素有默认行为,可能会基于父元素的spellcheck值。属性值为false时,表明元素不做拼写和语法检查。
    • wrapHTML5新增指定文本换行的方式。默认为soft。可能的值为:
      • hard:在文本到达元素最大宽度的时候,浏览器自动插入换行符(CR+LF)。比如指定cols值。
      • soft:在到达元素最大宽度的时候,不会自动插入换行符。

    HTML 4.01 与 HTML 5 之间的差异

    在 HTML 5 中有一些新属性,同时不再支持 HTML 4.01 中的一些属性。

    全局属性

    <textarea>标签支持HTML 的全局属性。

    事件属性

    <textarea>标签支持HTML 的事件属性。

    实例

    一个 HTML 文本区域:

    <textarea rows="10" cols="30">
    我是一个文本框。
    </textarea>
    

    上篇:<output>