JavaScript / jQueryにてページ表示時に指定したテキストボックスにフォーカスさせる方法
ページを開いた際に指定したテキストボックス(input type="text")にフォーカスさせてほしいという要望を受けた。JavaScript及びjQueryでの対応方法をメモ。
対応方法
ソースコード
<input type="text" id="test">
<script type="text/javascript" src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
<script>
//JavaScriptの場合
document.querySelector(`#test`).focus();
$(function(){
//jQueryの場合
$(`#test`).focus();
});
</script>
リファレンス
HTMLElement: focus() メソッド
https://developer.mozilla.org/ja/docs/Web/API/HTMLElement/focus
.focus()
関連記事
-
-
jQueryでユーザーが編集可能な文字列をページ上に表示する際にエスケープする方法
GETパラメータを取得し、その内容をページ上に表示したいケースがあった。また、A ...
-
-
formのpasswordとtextをjQueryで切り替える方法
formでtype="password"を指定していると内容を入力した際に｢●● ...
-
-
FullCalendarでラベルごとに表示・非表示を切り替える方法
Googleカレンダーだとページ左側にマイカレンダーというのがあり、その中に任意 ...
-
-
jQuery Alert Dialogsで表示後に処理したい
最近携わったサイトの中でJavaScript内に「jAlert」とかいう記述があ ...
-
-
日付の範囲指定用プラグイン「DateRangePicker」の利用方法
日付型のデータを検索する際に開始・終了日のテキストボックスを用意し、それぞれにタ ...