| ポイント |
<![CDATA[
txt = document.myFORM.myTEXT.value;
n = txt.match(/[\r|\n]/g);
if (n) len = n.length + 1; else len = 1;
document.myFORM.myTEXT.style.height = len * 16;
]]>
|
| 説 明 |
テキストエリアの行数に応じて高さを変えるには行数を求めます（前項を参照）。文字の高さを16pxとすれば高さは「行数×16」で求めることができます。高さを指定するにはテキストエリアのスタイルシートプロパティのheightに高さを入れます。 |
| サンプル |
<![CDATA[
<html>
<head>
<title>入力行数に応じてテキストエリアの高さを変える</title>
<script language="JavaScript"><!--
function set()
{
txt = document.myFORM.myTEXT.value;
n = txt.match(/[\r|\n]/g);
if (n) len = n.length + 1; else len = 1;
document.myFORM.myTEXT.style.height = len * 16;
}
// --></script>
</head>
<body>
<form name="myFORM">
<textarea rows="3" name="myTEXT"></textarea><br>
<input type="button" value="Set" onClick="set()">
</form>
</body>
</html>
]]>
|
| 補足説明 |
なし |
|
■サンプルスクリプトを実行する >>実行
■各ブラウザでの動作結果を見る >>View!
|
入力行数に応じてテキストエリアの高さを変える