JavaScriptにおけるfocusとblurメソッド
入力フォーカスとは何かは既にご存知でしょう。 また、フォーカスの設定や解除の方法も知っていますね:設定するには入力フィールドをクリックし、 解除するには別の場所をクリックします。
しかし、JavaScriptには、入力に強制的にフォーカスを設定したり、
そこからフォーカスを外したりすることを可能にする特別なメソッドが存在します。
それが focus メソッドと blur メソッドです。
例を見て、それらの動作を確認してみましょう。 ここにインプットとボタンがあるとします:
<input id="elem" value="text">
<input type="submit" id="button">
ボタンをクリックしたときに、入力フォーカスを 私たちのインプットに設定しましょう:
let elem = document.querySelector('#elem');
let button = document.querySelector('#button');
button.addEventListener('click', function() {
elem.focus();
});
二つのインプットが与えられています。 2文字入力した後、入力フォーカスが2番目のインプットに移るようにし、 そのインプットに2文字入力した後、フォーカスがそこから外れるようにしてください。