普通の input

全選択 ver. の input

クリック時に全選択にする

onclick 時に select 関数を呼んであげると全選択状態になります. 上記のサンプルの例でいくと, このコード

<textarea>I am a pen.</textarea>

に onclick=”this.select();”という23文字を加えて

<textarea onclick="this.select();">I am a superman.</textarea>

とするだけで, 選択した際にテキストを全選択してくれるようになります.

コピペ専用テキストエリアにする

内容をコピペして使ってほしくて textarea を使う際, 編集されると困っちゃいますよね. そもそも編集できてしまうことが問題です. textarea にはそんな時に便利な readonly という属性があります.

textarea に readonly を属性として追加すると読み取り専用にしてくれます.

textarea に readonly 属性を付けて

<textarea rows="6" cols="32" readonly onclick="this.select();">
#include <stdio.h>

int main() {
    print("Hello, world!\n");
    return 0;
}
</textarea>

とすれば,

といった感じでコピペ用全選択テキストエリアを作ることができます.