☰

jQuery: TAB キーのキーアップ? 質問する

tag-icon • tag-icon jquery tabs
jQuery: TAB キーのキーアップ? 質問する

そこで、Tab キーが押されたときにスクリプトを実行するのに問題があります。ちょっとグーグルで調べたところ、Tab の文字コードは 9 でした。また、ついでに、文字コードを使わずにキーが押されたかどうかを確認するもっと良い方法はありますか? 文字コードを使用すると、Firebug から次の警告が頻繁に表示されるので質問しています。

keyup イベントの 'charCode' プロパティは使用しないでください。値は無意味です。

とにかく、まだ動作するので、それは問題ではありません。これは私が使用するコードです:

$('/* my inputs */').keyup(function(e) {
   console.log('keyup called');
   var code = e.keyCode || e.which;
   if (code == '9') {
     console.log('Tab pressed');
   }
});

上記のコードを使用すると、コンソールは空白のままになり、何も追加されません (Firebug を使用)。もちろん、テキストをログに記録する代わりに実際に何かを実行しようとしましたが、何も実行されません。なぜこれが機能しないのか、誰かわかりますか? キーが押されたかどうかを確認するより良い方法はありますか?

前もって感謝します。

ベストアンサー1

私の直感では、Tab キーを押すと、キーアップが発生する前にフォームの入力がフォーカスを失うと思います。次のように、バインディングを body に変更してみてください。

 $('body').keyup(function(e) {
    console.log('keyup called');
    var code = e.keyCode || e.which;
    if (code == '9') {
    alert('Tab pressed');
    }
 });

その後、それが機能する場合 (私の場合は機能しました)、代わりにバインディングを keyDown に変更して、false を返してみてください。こうすることで、独自のカスタム動作を実装できます。

$('.yourSelector').keydown(function(e) {
   console.log('keyup called');
   var code = e.keyCode || e.which;
   if (code == '9') {
     alert('Tab pressed');

   return false;
   }

});

これら 2 つのうちの 1 つが機能するはずです... body の場合は、body に keydown ハンドラーをアタッチし、tab の場合は、フォーカスのあるフィールドを見つけます (関数 .hasFocus() があると思います)。それが必要なフィールドである場合は、続行して false を返します。それ以外の場合は、ブラウザーに任せます。

タブ文字を使用してフィールドを更新する場合は、コールバックでこれを試してください。

var theVal = $(this).val();
theVal = theVal + ' ';
$(this).val(theVal);

テストはしていませんが、動作するはずです。問題が発生する場合は、タブ文字の代わりに 3 つまたは 4 つのスペースを追加することもできます。

おすすめ記事