何も選択せずに Web サイトで入力を開始し、特定の入力フィールドにフォーカスできるようにする方法を探しています。
Google もこの機能を採用しています。検索結果では、どこでもクリックできます (検索フィールドの焦点を外します)。入力を開始すると、自動的に検索フィールドに再び焦点が当てられます。
フィールドに焦点を当てるためにjQueryの一般的なonkeyup関数について考えていましたが、何か提案はありますか?
とても有難い。
何も選択せずに Web サイトで入力を開始し、特定の入力フィールドにフォーカスできるようにする方法を探しています。
Google もこの機能を採用しています。検索結果では、どこでもクリックできます (検索フィールドの焦点を外します)。入力を開始すると、自動的に検索フィールドに再び焦点が当てられます。
フィールドに焦点を当てるためにjQueryの一般的なonkeyup関数について考えていましたが、何か提案はありますか?
とても有難い。
イベントをバインドする必要がありますがkeydown
、すぐにバインドを解除して、フォーカスをデフォルトの入力に戻さずに他のテキスト入力で入力を続行できるようにします。
$(document).bind('keydown',function(e){
$('#defaultInput').focus();
$(document).unbind('keydown');
});
答えは次のように簡単です。
$(document).keydown(function() { $('#element').focus(); });
keyup は最初のキーが押された後にのみ起動され、それぞれ検索フィールドに入力された最初のキーをキャプチャしないため、結局は keydown が優先されます。
このソリューションには、@mVChr のソリューションにある問題はありません。つまり、マウスで別の入力をクリックして、-binding のためにフォーカスを失うことなく入力を開始できますkeydown
。
また、このソリューションはすべての要素のkeydown
バインドを削除するのではなく、代わりに名前付きハンドラーを使用します。
var default_input_handler = function() {
$('.default-input').focus();
$(document).off('keydown', default_input_handler);
}
$(document).on('keydown', default_input_handler);
$('input, textarea, select').on('focus', function() {
$(document).off('keydown', default_input_handler);
});
これを行う予定がある場合は、onKeyDown の代わりに onKeyUp を使用することをお勧めします。インタラクションの流れを容易にするのに役立つアクションのはるかに早い段階です。