5

Ctrl+m を押してメニューを開くなど、キーボード ショートカットを使用して何かを構築しています。そのために jQuery と jwerty プラグインを使用します。これは次のコードのようになります。

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

「m」キーをタップすると、toggleMenu 関数がトリガーされます。

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

4

4 に答える 4

5

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;
    }
});

target-element が または のいずれかであるinput場合textarea、 を押しmても何も起こりませんが、これらの 2 つの要素のいずれでもないtoggleMenu()場合は、デフォルト状態に入り、が呼び出されます。

于 2013-05-22T18:55:42.067 に答える
0

:focusjQuery (および一部のブラウザー) が提供するセレクターと関数を使用isして、項目にフォーカスがあるかどうかをテストできます。

$(".my-thing").is(':focus')
于 2013-05-22T19:11:10.680 に答える
0

event.stopPropagation()1 つの方法は、入力とテキストエリアに(または jQuery を使用する場合は)を呼び出す別のイベント ハンドラーを追加することですreturn false。そうすれば、そのイベント ハンドラーが最初にトリガーされ、イベントが既存のハンドラーに「伝播」するのを防ぐことができます。

別のオプションは、既存のハンドラー内のイベントをチェックして、それが入力/テキストエリアからのものかどうかを確認することです (このアプローチを採用する場合は、他の回答を参照してください。(本当に) 古いブラウザーの下位互換性が必要な場合は、 activeElement は古いブラウザーではサポートされていないため、David の回答を使用するには、どのブラウザーが document.activeElement をサポートしていますか? )。

于 2013-05-22T18:56:01.740 に答える