正確なキーコード伝播を使用して Safari でキーボード イベントをシミュレートする方法

JavaScript を使用した Safari でのキーボード イベントのシミュレート

従来のアプローチを使用して Safari でキーボード イベントをシミュレートしようとすると、開発者はキー コードがゼロに設定されるという問題に遭遇することがよくあります。希望の値。ただし、JavaScript の DOM キーボード イベント レベル 3 ポリフィルを使用できる信頼性の高い解決策があります。

DOM キーボード イベント レベル 3 ポリフィル

DOM キーボード イベント レベル 3 ポリフィルを使用すると、開発者はキーボード イベントを作成およびディスパッチできます。互換性が強化されました。このポリフィルを使用するには、次の手順に従います。

element.addEventListener("keydown", function(e){ console.log(e.key, e.char, e.keyCode) })

var e = new KeyboardEvent("keydown", {bubbles : true, cancelable : true, key : "Q", char : "Q", shiftKey : true});
element.dispatchEvent(e);

レガシー プロパティ

「keyCode」、「charCode」、「that」などのレガシー プロパティが必要な場合は、更新されたポリフィルが完全に削除されます。彼らをサポートします。 KeyboardEvent を次のように初期化するだけです。

var e = new KeyboardEvent("keydown", {
    bubbles : true,
    cancelable : true,
    char : "Q",
    key : "q",
    shiftKey : true,
    keyCode : 81
});

代替オプション

ブラウザ間の互換性を確保するには、次の代替 initKeyboardEvent メソッドの使用を検討してください。

function initKeyboardEvent(type, bubbles, cancelable, view, key, location, modifiersList, repeat, locale) {
    var evt = document.createEvent("KeyboardEvent");
    evt.initKeyboardEvent(type, bubbles, cancelable, view, key, location, modifiersList, repeat, locale);
    return evt;
}

結論

DOM キーボード イベント レベル 3 ポリフィルまたは代替手段を利用するinitKeyboardEvent メソッドを使用すると、Safari でキーボード イベントを確実に作成して送信できるようになり、正確なキー コードの伝播が保証されます。

以上が正確なキーコード伝播を使用して Safari でキーボード イベントをシミュレートする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。