テキストエリアや入力フォームにフォーカスが来たときにテキストを全選択状態にする方法
たった23文字のコードを追加するだけで, 入力フォームやテキストエリアにフォーカスが来たときに 文字を全選択にする方法について書きました.
超簡単に出来る割にはあまり使われていないのでざっくりまとめてみました. トラックバックフォームなどに使ってくださいな♪
Sample
普通の input
全選択 ver. の input
Tips
クリック時に全選択にする
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>
とすれば,
といった感じでコピペ用全選択テキストエリアを作ることができます.
エントリーにするまでもない内容ですが, 結構使う割には忘れちゃうことがあったので.
覚書 テキストエリア
http://t.co/8TWqFcjz
ぽけったー テキストエリアや入力フォームにフォーカスが来たときにテキストを全選択状態にする方法