28

keydownHTML ページの特定の textarea 要素でイベントをシミュレートしたいと考えています。私はChromeを使用しているのでinitKeyboardEvent、変数を呼び出して、keyCode入力したいをテキストエリアに渡しました。これが私が試したものです：

var keyEvent = document.createEvent('KeyboardEvent');
keyEvent.initKeyboardEvent('keydown', true, false, null, 0, false, 0, false, 77, 0);
inputNode.dispatchEvent(keyEvent);

このコードでは文字を入力していますが、テキストエリアはキーである 13mしか取得していません。そこで、値を に設定するオンラインで見たオーバーライド コードを試しましたが、成功しませんでした。keyCodeEnterkeyCodeVal

var keyEvent = document.createEvent('KeyboardEvent');
Object.defineProperty(keyEvent, 'keyCode', { 
                         get : function() {
                                 return this.keyCodeVal;
                         }
                        });
keyEvent.initKeyboardEvent('keydown', true, false, null, 0, false, 0, false, 77, 0);
keyEvent.keyCodeVal = 77;
inputNode.dispatchEvent(keyEvent);

値を設定する方法を知っている人はいkeyCodeますか?

4

6 に答える 6

79

とてもとても近い...

「which」プロパティをオーバーライドする必要がありました。サンプルコードは次のとおりです。

Podium = {};
Podium.keydown = function(k) {
    var oEvent = document.createEvent('KeyboardEvent');

    // Chromium Hack
    Object.defineProperty(oEvent, 'keyCode', {
                get : function() {
                    return this.keyCodeVal;
                }
    });     
    Object.defineProperty(oEvent, 'which', {
                get : function() {
                    return this.keyCodeVal;
                }
    });     

    if (oEvent.initKeyboardEvent) {
        oEvent.initKeyboardEvent("keydown", true, true, document.defaultView, false, false, false, false, k, k);
    } else {
        oEvent.initKeyEvent("keydown", true, true, document.defaultView, false, false, false, false, k, 0);
    }

    oEvent.keyCodeVal = k;

    if (oEvent.keyCode !== k) {
        alert("keyCode mismatch " + oEvent.keyCode + "(" + oEvent.which + ")");
    }

    document.dispatchEvent(oEvent);
}

使用例:

Podium.keydown(65);

注: このコードは、IE、Safari、またはその他のブラウザーで動作するようには設計されていません。まあ、たぶんFirefoxで。YMMV。

于 2012-05-09T16:15:23.967 に答える
14

Orwellophileのソリューションは機能します。

  • 最初：'keyCode'、'charCode'、および'which'はSafariおよびIE9+では読み取り専用です（少なくとも）。
  • 2番目：initKeyboardEventはちょっと面倒です。すべてのブラウザは異なる方法でそれを実装します。Webkitでも、initKeyboardEventにはいくつかの異なる実装があります。そして、OperaでinitKeyboardEventを実行する「良い」方法はありません。
  • 3番目：initKeyboardEventは非推奨になりました。initKeyEventまたはKeyboardEventコンストラクターを使用する必要があります。

ここでは、クロスブラウザーのinitKeyboardEvent関数（要点）を作成しました。

例：

var a = window.crossBrowser_initKeyboardEvent("keypress", {"key": 1, "char": "!", shiftKey: true})
alert(a.type + " | " + a.key + " | " + a.char + " | " + a.shiftKey)

これが、クロスブラウザーのKeyboardEventコンストラクターを使用したDOMキーボードイベントレベル3ポリフィルです。

例：

var a = new KeyboardEvent("keypress", {"key": 1, "char": "!", shiftKey: true})
alert(a.type + " | " + a.key + " | " + a.char + " | " + a.shiftKey)

例2

例3

重要な注意1：charCode、keyCode、および非推奨のプロパティ。したがって、私のcrossBrowser_initKeyboardEvent no KeyboardEventコンストラクターは、一部のブラウザーでそのプロパティの正しい値を絶対的に保証されていません。代わりにプロパティ「key」と「char」を使用するか、私の要点を編集して、読み取り専用のcharCode、keyCode、およびどのプロパティを備えたブラウザでinitEventを強制的に使用することができます。

重要な注意2：keypressイベントは非推奨であり、現在、キーボードイベントレベル3ポリフィルではサポートされていません。つまり、keypressイベントのkeyプロパティとcharプロパティはランダムな値を持つことができます。私はその問題を下位互換性に修正するために取り組んでいます。

于 2013-01-28T11:44:30.363 に答える
4

@Orwellophile のスクリプトを Google Chrome 26.0.1410.65 (問題がある場合は Mac OS X 10.7.5) で動作させるには、1 行を変更する必要がありました。彼のスクリプトは、 MDNinitKeyboardEventとは異なる順序でパラメーターを持っているようです。 initKeyboardEvent のドキュメント。

変更された行は次のようになります。

oEvent.initKeyboardEvent("keydown", true, true, document.defaultView, k, k, "", "", false, "");
于 2013-04-15T18:55:26.830 に答える
0

上記の解決策はすべて機能していますが、機能しないケースが 1 つあります。

Dart が使用されている場合、KeyboardEvents を使用する Dart コードは一般的なイベントでは機能しません。

get$keyCode is undefined のようなものが表示されます。

これについて何時間も頭を悩ませた後、次のトリックを見つけました。

function __triggerKeyboardEvent(el, keyCode)
{
   var eventObj = document.createEventObject ?
       document.createEventObject() : document.createEvent("Events");

   var tempKeyboardObj = document.createEvent("KeyboardEvents");

   if(eventObj.initEvent){
      eventObj.initEvent("keydown", true, true);
   }
   eventObj.___dart_dispatch_record_ZxYxX_0_ = tempKeyboardObj.___dart_dispatch_record_ZxYxX_0_
   eventObj.keyCode = keyCode;
   eventObj.which = keyCode;

   el.dispatchEvent ? el.dispatchEvent(eventObj) : el.fireEvent("onkeydown", eventObj);

}

Dartインターセプターをだまして、イベントが実際にはKeyboardEventであることを示し、トリックを行いました。

Webkit ベースのブラウザーで Dart アプリをテストしようとしている貧しい人のために、ここに残しておきます。

于 2014-11-25T18:36:16.743 に答える
0

私はそれをうまく機能させることができませんでしたが、このスレッドで理由を見つけました。セキュリティ上の理由から許可されなくなったようです。一部のイベントは信頼できません

JavaScript が InputEvent.isTrusted = true をトリガーする

于 2021-02-16T21:48:48.297 に答える