HTML textarea控件

textarea控件

textarea控件用来创建一个支持多行的文本输入区域，如果没有使用 maxlength  属性限制文本区域的最大字符数量，访问者可以输入多达 32700 个字符。

可以通过 rows 属性和 cols 属性，来定义 textarea控件的默认尺寸，即可见的行数和列数。由于 textarea控件没有 value 属性，在定义 textarea控件时，出现在 <textarea> 和 </textarea> 之间的文本，就是控件的默认值。如：

1. <textarea name="comment" rows="5" cols="50">这里是 textarea 的内容</textarea>

上述代码定义了一个多行输入文本区域，其默认尺寸为 5 行×50 列，并包含默认值。运行结果如图 3‑23 所示：

图3-23 textarea控件

定义 rows 属性后，当用户输入的行数超过 rows 属性设定的值后，textarea控件会自动添加滚动条。因此，为了方便用户使用，可以根据应用场景，大概预测一下用户要输入文本的行数，并设定合理的行数。当然，用户可以通过拖曳 textarea控件右下角的斜线，来改变控件的大小。但是，如果设置了textarea { resize: none; }，就无法执行拖曳操作了。

虽然可以通过 cols 和 rows 属性来规定 textarea 的尺寸，不过，在实际应用中，最好还是使用 CSS 的 height 和 width 属性，来显式设置 textarea控件的宽度和高度。

可以通过 placeholder 属性来定义 textarea控件的占位文本，如果同时定义了默认值和 placeholder 属性，则优先显示默认值。

提交表单时，textarea元素的 name 属性值和用户在 <textarea> 和 </textarea> 之间输入的文本，将会被提交到服务器端。

关于作者

歪脖先生，十五年以上软件开发经验，酷爱Web开发，精通 HTML、CSS、JavaScript、jQuery、JSON、Python、Less、Bootstrap等，著有《HTML宝典》、《揭秘CSS》、《Less简明教程》、《JSON教程》、《Bootstrap2用户指南》，并全部在 GitHub 上开源。

版权声明：本文出自 歪脖网 的《HTML宝典》，欢迎在线阅读，并提出宝贵意见。