最初のテキストボックスにフォーカスするのはrange.select()でやったらウハウハになれた

メモ。

上の記事では、DOM的に一番最初にある input type="text" 要素にフォーカスを当てるスクリプトを作っている。

もちろん、一番最初に来るテキストボックスがページ内検索欄 (または類似用途のもの) であることが多いためだと思う。


ところで、僕はページを開いたときに勝手にフォーカスを当てられるのは嫌いなので、以下のようなUserJSを使ってそれを防いでいる。

特に最初のやつは強力で、HTML要素のプロトタイプの focus() を再定義している。

そういうわけで、入力欄にフォーカスを当てるようなJavaScriptは動かないだろうと勝手に思い込んでいた。


しかし、Karafuto Blogの一番下にあるブックマークレットでは、focus() ではなく range.select()を使うので、focus() を殺すスクリプトとも併用できる。

それをほんのちょっと改変して、フォーカスしたときに入力欄の最後にカーソルをあてるするようにした。

javascript:(function(){var input=document.getElementsByTagName('input');for(var i=0;i<input.length;i++){if(input[i].type=='text')break;}var textbox=input[i];var range=textbox.createTextRange();range.select();textbox.setSelectionRange(textbox.value.length,textbox.value.length);})();

こういうブックマークレット、ずっと欲しかったんだよ。

HTML的に一番最初に来るテキストボックスがページ内検索でない場合はハイソレマデヨー。