Tab入力の移動先を変更する

 ボタン上でTab入力を行ったときに、デフォルトの移動先を変更する方法を紹介します。使用しているアプリケーションは、こちらの記事で作成したものです。

最初にボタンのHTML要素を取得するため、詳細の静的IDを設定します。

以下では、ボタンB_SUBMITに静的IDとしてB_SUBMITを設定しています。

ページ・プロパティのJavaScriptのファンクションおよびグローバル変数の宣言として、以下を記述します。

document.getElementById("B_SUBMIT").onkeydown = function(event) {
    if (event.key == "Tab") {
        apex.items.P1_TEXT.setFocus();
        event.preventDefault();
    }
};

event.preventDefault();を呼び出さないとTabのデフォルトの動作も発生するため、フォーカスを当てた次のページ・アイテムにフォーカスが移動します。今回のコード例ではページ・アイテムP1_TEXTにフォーカスを移動していますが、event.preventDefault();を呼び出さないと、その次のP1_LISTにフォーカスが移動します。

完