textareaObject.wrapは、テキストエリア(Textarea要素)のwrap属性の値を取得、もしくは、設定するプロパティ。
wrap属性には、テキストエリア(Textarea要素)の入力文字数が一行あたりに表示できる文字数を超えたときの処理方法を指定することができる。
構文
取得
var $wrap = $textareaElementReference.wrap;
戻り値
テキストエリア(Textarea要素)のwrap属性の値。
- テキストエリアの入力文字数が一行あたりに表示できる文字数を超えたとき、自動改行するが、送信内容には自動改行を含めないのであれば、
soft
を返す。 - テキストエリアの入力文字数が一行あたりに表示できる文字数を超えたとき、自動改行し、送信内容にも自動改行を含めるのであれば、
hard
を返す。 - テキストエリアの入力文字数が一行あたりに表示できる文字数を超えたとき、自動改行しないのであれば、
off
を返す。
設定
$textareaElementReference.wrap = "soft|hard|off";
- soft|hard|off
- テキストエリアの入力文字数が一行あたりに表示できる文字数を超えたとき、自動改行するかどうか、自動改行を送信内容に含めるかどうかを指定。
soft
:自動改行するが、送信内容には自動改行を含めない。hard
:自動改行し、送信内容にも自動改行を含める。off
:自動改行しない。
- 初期設定値は、
soft
。
サンプル
サンプルの動作について
- 「soft」ボタンをクリックすると、テキストエリアの入力文字数が一行あたりに表示できる文字数を超えたとき、自動改行するが、送信内容には自動改行を含めないようにする。「サンプルテキストエリアのwrap属性の値:」の右横に「soft」と表示する。
- 「hard」ボタンをクリックすると、テキストエリアの入力文字数が一行あたりに表示できる文字数を超えたとき、自動改行し、送信内容にも自動改行を含めるようにする。「サンプルテキストエリアのwrap属性の値:」の右横に「hard」と表示する。
- 「off」ボタンをクリックすると、テキストエリアの入力文字数が一行あたりに表示できる文字数を超えても自動改行しないようにする。「サンプルテキストエリアのwrap属性の値:」の右横に「off」と表示する。
サンプルのソースコード
JavaScript
<script type="text/javascript">
function setWrap( $wrap ) {
var $elementReference = document.getElementById( "sample" );
$elementReference.wrap = $wrap;
var $wrap = $elementReference.wrap;
document.getElementById( "sampleOutput" ).innerHTML = $wrap;
}
</script>
function setWrap( $wrap ) {
var $elementReference = document.getElementById( "sample" );
$elementReference.wrap = $wrap;
var $wrap = $elementReference.wrap;
document.getElementById( "sampleOutput" ).innerHTML = $wrap;
}
</script>
HTML
<p>
<button onclick="setWrap('soft');">soft</button>
<button onclick="setWrap('hard');">hard</button>
<button onclick="setWrap('off');">off</button>
</p>
<form id="sampleForm" method="get" action="http://alphasis.info/2014/02/javascript-dom-textarea-wrap/" target="_blank">
<p>サンプルテキストエリアのwrap属性の値:<span id="sampleOutput">hard</span></p>
<p>サンプルテキストエリア:<textarea id="sample" name="sampleName" wrap="hard" cols="10">内容</textarea></p>
<p><input type="submit" value="送信"></p>
</form>
<button onclick="setWrap('soft');">soft</button>
<button onclick="setWrap('hard');">hard</button>
<button onclick="setWrap('off');">off</button>
</p>
<form id="sampleForm" method="get" action="http://alphasis.info/2014/02/javascript-dom-textarea-wrap/" target="_blank">
<p>サンプルテキストエリアのwrap属性の値:<span id="sampleOutput">hard</span></p>
<p>サンプルテキストエリア:<textarea id="sample" name="sampleName" wrap="hard" cols="10">内容</textarea></p>
<p><input type="submit" value="送信"></p>
</form>