入力にフォーカスがあるかどうかをテストします。

Question

キーボードのショートカットで何かをビルドしています。 Ctrl + mを押してメニューを開きます。私はそのためのjQueryとjwertyプラグインを使用し、これは次のコードのようになります。「M」キーをタップする

jwerty.key('m', function() { 
    toggleMenu(); 
}); 

はtoggleMenu機能をトリガします。

これで、ユーザーが入力フィールドまたはテキストエリアに入力しているときに、この関数がトリガーされないようにする方法が不思議でした。

Answer 1

私はjwertyを使用したことがありませんが、私はお勧めしたい：

jwerty.key('m', function (e) { 
    if (e.target.tagName.toLowerCase() !== 'input') { 
     toggleMenu(); 
    } 
}); 

これは、イベントのターゲットをテストし、そして、それはないinputだ場合、toggleMenu()関数を呼び出します。 がの場合はinputですが、何もしません（ご希望の場合は明示的にreturn falseとなります）。私は実際に行っている必要があり、上記のように、textareaを説明するために

はif評価に別の句を追加する（拡張することができ、あるいは以下、switchベースのアプローチをとることができます。

jwerty.key('m', function (e) { 
    switch (e.target.tagName.toLowerCase()) { 
     case 'input': 
     case 'textarea': 
      break; 
     default: 
      toggleMenu(); 
      break; 
    } 
}); 

ターゲット要素がmを押すと、どちらかinputまたはtextareaある場合ないこれら二つの要素のいずれかの場合、デフォルトの状態に入るとtoggleMenu()が呼ばれるのに対し、何もしません。

Answer 2

event.stopPropagation()（またはjQueryを使用する場合はreturn false）を呼び出す入力とテキストエリアに、別のイベントハンドラを追加する方法もあります。こうすることで、イベントハンドラが最初にトリガされ、イベントが既存のハンドラに「伝播」しないようにします。

もう1つの方法は、既存のハンドラ内のイベントを入力/テキストエリアから取得したかどうかをチェックすることです（このアプローチをとる場合は他の回答を参照してください。 activeElementは古いブラウザではサポートされていないため、Davidの答えを使用したいと考えています：Which browsers support document.activeElement?）。

は商品にフォーカスしているかどうかをテストするためにjQueryの（と一部のブラウザ）が提供する :focusセレクタと is機能を使用することができます

Answer 3

：// githubの：

$(".my-thing").is(':focus')