web-dev-qa-db-ja.com

廃止された `keypress` DOMイベントの代替

MDN記事keypressイベントによると非推奨です：

enter image description here

しかし、このイベントを新しいプロジェクトで使用する必要があるかどうかについては、どこにも情報がありません。すべきでない場合、代わりは何ですか？

誰かが洞察を与えることができますか？

javascripthtmleventsdomdom-events
10
Alexander Abakumov

イベントは非推奨であるため、新しいコードでの使用は避け、古いコードからの削除を計画する必要があります。 W3C仕様 は、廃止予定の機能について次のように述べています。

非推奨とマークされた機能は、古い実装または仕様への参照として仕様に含まれていますが、オプションであり、推奨されません。この仕様では、既存のまたは進行中の置き換えがある機能のみを非推奨にする必要があります。機能のサポートがまだ含まれていない実装は、既存のコンテンツとの下位互換性の理由で非推奨の機能を実装できますが、コンテンツを作成するコンテンツ作成者は、他の方法がない限り、非推奨の機能を使用しないでください。ユースケースを解決します。この仕様を参照する他の仕様は、廃止予定の機能を使用してはいけません（SHOULD NOT）。この仕様で非推奨とマークされた機能は、将来の仕様から削除される予定です。

keypress event さんのコメント：

警告keypressイベントタイプは、参照と完全を期すためにこの仕様で定義されていますが、この仕様では、このイベントタイプの使用を廃止しています。コンテキストの編集時に、作成者は beforeinput イベントを代わりにサブスクライブできます。

keydown およびkeyupイベントを使用することもできます。参照 keyup、keydown、keypress、inputイベントの違いは何ですか？

ただし、beforeinputはまだあまりサポートされていないため、これらの他のイベントのいずれもユースケースに適合しない場合は、今のところkeypressを引き続き使用する必要があります（それが「ユースケースを解決する他の方法はありません」という仕様の例外）。

5
Barmar

（あなたに恥）あなたやあなたが使う何かがあらゆる機会で無差別にバブリングしているイベントでない限り、回避するのはそれほど難しくありません。

このようなシンプルでありながら強力なユーティリティは、HTMLの孤立したノードリーフに対してのみ実行する必要がある理由です。

キーダウンバブリングを防止する必要があった場合は、document.bodyの代わりに引数をとる関数に次のコードをラップし、「keypress2」イベントを利用できるようにしたい場合は、バブリングが停止した時点で適用するだけです。そのHMTL。

const keyBlacklist = [
    'Shift',
    'Alt',
    'Control',
    'Meta'
];

document.body.addEventListener('keydown',(e)=>{
    if(keyBlacklist.indexOf(e.key) === -1){
        const newKeyPress = new CustomEvent('keypress2',{detail:e});
        e.target.dispatchEvent(newKeyPress);
    }
});

document.body.addEventListener('keypress2',e=>{console.log(e.detail);});
0
Erik Reppen