JavaScript: テキストボックスを選択状態にする select()

JavaScriptでテキストボックスを選択状態にするには、 select()メソッドを使用します。

テキストを選択状態にするサンプルコード

テキストにフォーカスが当たった時に選択状態にします。

下にある2つのテキストボックスの内、上がinput要素を使った1行テキストで、

下がtextarea要素を使った複数行テキストです。

HTML


<p><input id="test1" type="text" value="hello world" /></p>

<p><textarea id="test2">hello world</textarea></p>

JavaScript

input要素も、textarea要素もやることは同じです。

select()メソッドを使うだけです。


// input要素
let elem1 = document.getElementById('test1');

elem1.addEventListener('click', function(){
	this.select();
}, false);

// textarea要素
let elem2 = document.getElementById('test2');

elem2.addEventListener('click', function(){
	this.select();
}, false);

JavaScript入門