1

そのため、最初のページの子として別のページ (ブラウザー タブ) を開く Web ページがあります。親タブには、アプリケーションの作業の大部分を実行するコードが含まれています。子タブには、通常は親タブに埋め込まれているコンポーネントが含まれていますが、ユーザーがそれを独自のタブで開きたい場合があります。だから彼らはできる。

問題は、子タブのコンポーネントが約 20 の異なるキーボード コマンドと多数のマウス関連コマンド (キーボード コマンドとの組み合わせ) をサポートしていることです。子ウィンドウの各キーボードコマンドを親ウィンドウの呼び出しに再マッピングしないようにしていました。現在、親ウィンドウでプラグインを使用して、適切なコンポーネント API 呼び出しに送信されるキーボード コマンドをマッピングおよび処理しています。

私がやりたいことは、キーボードとマウスのイベントを子ウィンドウから親ウィンドウにパイプするだけで、これらのイベントの通常の処理が通常どおり続行できるようにすることです。子ウィンドウですべてのコマンドに対して特定のハンドラーをもう一度セットアップする必要はありません。キー/マウス イベントのパイピングはよりエレガントに感じられ、理想的にはコードが少なくて済みます。

私が最初に試したのはこれです：

// CHILD WINDOW
window.document.addEventListener("keydown",  Redispatch, false);
function Redispatch(event){  
        window.opener.myRedirector.dispatchChildEvent(event);
 }

そして親ウィンドウには、これがありました：

myRedirector.dispatchChildEvent = function(event){
    var r = dispatchEvent(e);
    console.log('dispatched event from child window');
}

この場合、何も起こりません。親ウィンドウのconsole.log()関数は決して起動せず、それをステップ実行しても、console.log()行がヒットすることはありません。dispatchEvent(e)呼び出しは、エラーが発生したかのように動作しますが、何もスローされません (これが最新の Chrome です) 。

そこで、次のように親で新しいイベントをインスタンス化してみました (別の StackOverflow 投稿から見た):

myRedirector.dispatchChildEvent = function(e){
    var event  = document.createEvent('KeyboardEvent');
    var method = typeof event.initKeyboardEvent !== 'undefined' ? "initKeyboardEvent" : "initKeyEvent";

    event[method](
        /* type         */ e.type,
        /* bubbles      */ true,
        /* cancelable   */ false,
        /* view         */ window,
        /* keyIdentifier*/ e.keyIdentifier,
        /* keyLocation  */ e.location,
        /* ctrlKey      */ e.ctrlKey,
        /* altKey       */ e.altKey,
        /* shiftKey     */ e.shiftKey,
        /* metaKey      */ e.metaKey,
        /* altGraphKey  */ false
  );
}

ここでの問題は、 keyCodeやwhichなど、イベントのすべてのプロパティが初期化されないことです。私が使用しているキーボード ハンドラー プラグインは keyIdentifier を読み取らず、 keyCodeを使用します。オブジェクトで読み取り専用であるため、 keyCodeを手動で設定することはできません。keyIdentifierを読み取るようにプラグインを変更することを考えましたが、その値は整数ではなく、「U+005」などの Unicode 文字列であり、すべての keyCodes をプラグインのそれらの値に再マップしたくありません。 (ただし、これは Chrome 固有のものである可能性があります)。

そのため、CustomEvent のインスタンス化も試み、プロパティを追加するだけで、ほとんど機能しました。ただし、CustomEvent には空の文字列に設定された型プロパティがあり、オーバーライドできないため、「keydown」などの型ではないため、プラグインはそれをキャッチしません。

これを可能にする何かが欠けているような気がします。そのため、値を再マッピングしたり、子ウィンドウにすべての新しいハンドラーを設定したりするなど、他の解決策を避けてきました。

キーボード/マウスイベントを親ウィンドウにパイプするだけでよいように思えます。しかし、今のところ、方法が見つからないようです。

提案、または解決策はありますか？

4

1 に答える 1