web-dev-qa-db-ja.com

javascriptでキーボードレイアウトを検出する

JavaScriptを使用して現在のキーボードレイアウトを検出する方法はありますか? this が見つかりましたが、訪問者が英語のレイアウトを使用しているかどうかのみが検出されます。文字列として正確なレイアウトを知る必要があります。例:de-chfrまたはen

17
Parzifal

キーボードレイアウトには、標準化された識別子がありません。それらには、レイアウト作成者によって割り当てられた名前があります。それらは、1つの定義されたプロパティとして言語の関連付けを持っている場合があります。

キーボードレイアウトを言語またはロケール識別子と混同しないでください。特に、単一の「英語のレイアウト」はありませんが、英語に使用できる数十のレイアウトがあります。

通常、システムが現在のレイアウト設定をJavaScriptで読み取れるようにすることはないと思います。

したがって、キーボードレイアウトを検出して解決しようとしている問題が何であれ、別のアプローチが必要です。

12

この質問は古いことは知っていますが、一部のキーが他のロケールの異なる文字にマップされているという事実に悩まされている方のために、これに対処するために使用できるアプローチを示します。

ほとんどの場合、キーボードイベントハンドラーがkeyupまたはkeydownイベントに関連付けられています。この場合のevent.whichまたはevent.keyCodeプロパティの結果は、ユーザーがどのキーを押したかに関連付けられています。たとえば、「;」と入力するために使用するのと同じキーENレイアウトでは、RUレイアウトで「ж」と入力するために使用されるキーであり、イベントは両方のコードとして186を報告します。

ただし、キーを押した結果の文字に関心がある場合は、代わりに「keypress」イベントを使用する必要があります。このイベントはkeydown/upの後に発生し、event.whichまたはevent.charCode内に入力された文字の実際のUnicodeコードポイントを報告します。これは上記の例では10進数の1078またはU +0436です。

したがって、キーボードレイアウトを推測したくない場合で、キーアップとキーダウンを区別する必要がない場合は、キーを押すことが実行可能な代替手段になる可能性があります。完璧ではありませんが(ほとんどのブラウザーは、修飾キー、ファンクションキー、ナビゲーションキーなど、文字を印刷しないキーのキー押下イベントを一貫して報告しません)、印刷可能な文字を処理するときにキーコードを推測するよりはましです。

16
Nathaniel

あなたが探しているのは、彼らのロケールを検出する方法です。 HTTPヘッダーでは、これは Accept-Language ヘッダーに格納されますが、純粋なJSを介してブラウザーで使用することはできません。

' Browser Language 'というjQueryプラグインがあり、正しい道を進むことができます。

2

このトピックについて私が知っていて、すでにその解決策を実装しているのは、英語以外のレイアウトキーボードを検出することですつまり、英語で使用されているもの以外のアルファベットを使用する言語。解決策は、任意の単語文字に一致する正規表現に依存しています\w、任意の数字\dおよび事前定義された英語キーボードの特殊文字の範囲であるため、アラビア語、日本語などの他の文字は一致しません。これはすべてキーダウンイベントを使用し、このソリューションを使用して制限し、ログインフォームのユーザー名とパスワードのフィールドエントリを通知します。次のような関数にパッケージ化しました。

function checkKeyboard(ob,e){
        re = /\d|\w|[\.\$@\*\\\/\+\-\^\!\(\)\[\]\~\%\&\=\?\>\<\{\}\"\'\,\:\;\_]/g;
      a = e.key.match(re);
      if (a == null){
        alert('Error 2:\nNon English keyboard layout is detected!\nSet the keyboard layout to English and try to fill out the field again.');
        ob.val('');
        return false;
      }
      return true;
    } 

次に、イベントから次のように関数を呼び出します。

$("#textFieldId").keydown(function(e){
        if (!checkKeyboard($(this),e)){
            return false;
        }
    });

これは Working DEMO 不明なダウン有権者向けです!

1
SaidbakR