3.3.3 textarea控件
优质
小牛编辑
135浏览
2023-12-01
textarea控件用来创建一个支持多行的文本输入区域,如果没有使用 maxlength 属性限制文本区域的最大字符数量,访问者可以输入多达 32700 个字符。
可以通过 rows 属性和 cols 属性,来定义 textarea控件的默认尺寸,即可见的行数和列数。由于 textarea控件没有 value 属性,在定义 textarea控件时,出现在 <textarea> 和 </textarea> 之间的文本,就是控件的默认值。如:
<textarea name="comment" rows="5" cols="50">这里是 textarea 的内容</textarea>
上述代码定义了一个多行输入文本区域,其默认尺寸为 5 行×50 列,并包含默认值。运行结果如图 3‑23 所示:
定义 rows 属性后,当用户输入的行数超过 rows 属性设定的值后,textarea控件会自动添加滚动条。因此,为了方便用户使用,可以根据应用场景,大概预测一下用户要输入文本的行数,并设定合理的行数。当然,用户可以通过拖曳 textarea控件右下角的斜线,来改变控件的大小。但是,如果设置了textarea { resize: none; },就无法执行拖曳操作了。
虽然可以通过 cols 和 rows 属性来规定 textarea 的尺寸,不过,在实际应用中,最好还是使用 CSS 的 height 和 width 属性,来显式设置 textarea控件的宽度和高度。
可以通过 placeholder 属性来定义 textarea控件的占位文本,如果同时定义了默认值和 placeholder 属性,则优先显示默认值。
提交表单时,textarea元素的 name 属性值和用户在 <textarea> 和 </textarea> 之间输入的文本,将会被提交到服务器端。