[解決済み】JavaScriptでcaps lockがオンになっているかどうかを判断する方法は？

質問

JavaScriptでcaps lockがオンになっているかどうかを判断する方法は？

しかし、1つだけ注意点があります。私がググったところ、最も良い解決策は onkeypress イベントを入力するたびに、押された文字が大文字かどうかをチェックし、大文字の場合は、シフトも押されているかどうかをチェックします。もしそうでなければ、caps lockがオンになっているはずです。これは本当に汚いと思います。 無駄 - もっといい方法があるのでは？

解決方法は？

試してみてください。 動作例を追加しました。 入力にフォーカスがあるときに、caps lockをオンにすると、ledが赤になり、それ以外の場合は緑になります。 (mac/linuxでは未検証です。）

注：どちらのバージョンも私にとっては動作しています。 コメントでの建設的な意見に感謝します。

旧バージョン。 https://jsbin.com/mahenes/edit?js,output

また、以下は修正版です（どなたかmacでテストして確認してください）。

新バージョンです。 https://jsbin.com/xiconuv/edit?js,output

NEW VERSION:

function isCapslock(e) {
  const IS_MAC = /Mac/.test(navigator.platform);

  const charCode = e.charCode;
  const shiftKey = e.shiftKey;

  if (charCode >= 97 && charCode <= 122) {
    capsLock = shiftKey;
  } else if (charCode >= 65 && charCode <= 90
    && !(shiftKey && IS_MAC)) {
    capsLock = !shiftKey;
  }

  return capsLock;
}

OLD VERSIONです。

function isCapslock(e) {
  e = (e) ? e : window.event;

  var charCode = false;
  if (e.which) {
    charCode = e.which;
  } else if (e.keyCode) {
    charCode = e.keyCode;
  }

  var shifton = false;
  if (e.shiftKey) {
    shifton = e.shiftKey;
  } else if (e.modifiers) {
    shifton = !!(e.modifiers & 4);
  }

  if (charCode >= 97 && charCode <= 122 && shifton) {
    return true;
  }

  if (charCode >= 65 && charCode <= 90 && !shifton) {
    return true;
  }

  return false;
}

国際的な文字については、必要に応じて以下のキーにチェックを追加することができます。 興味のある文字のキーコード範囲を取得する必要があります。キーマッピング配列を使って、対応するすべての有効なユースケースキーを保持することができます。

大文字のA-Zまたは'Ä', 'Ö', 'Ü', 小文字のa-Zまたは0-9または'ä'、'ö'、'ü'

上記のキーは、あくまでもサンプル表現です。