0

キーイベントをキャプチャし、それらに関数を簡単にバインドするための小さなスクリプトにまだ取り組んでいます。しかし、私は今のところ立ち往生しています！

問題は、複数の「イベントハンドラー」を初期化すると、最初の初期化の引数が上書きされることです。

数千の単語は、数行のコードよりも多くを語ることはありません。だから、これが私がこれまでにやったことです：

var keyCodes={a:65,b:66,c:67,d:68,e:69,f:70,g:71,h:72,i:73,j:74,k:75,l:76,m:77,n:78,o:79,p:80,q:81,r:82,s:83,t:84,u:85,v:86,w:87,x:88,y:89,z:90,"0":48,"1":49,"2":50,"3":51,"4":52,"5":53,"6":54,"7":55,"8":56,"9":57,f1:112,f2:113,f3:114,f4:115,f5:116,f6:117,f7:118,f8:119,f9:120,f10:121,f11:122,f12:123,shift:16,ctrl:17,control:17,alt:18,option:18,opt:18,cmd:224,command:224,fn:255,"function":255,backspace:8,"delete":8,enter:13,"return":13,left:37,up:38,right:39,down:40};

var keyCall = function(k, fn, c, e, k2, nk) {
    this.onkeydown = function() {
        nk = k.split(" ");
        c = e ? e.which : event.keyCode;
        if (nk.length > 1) {
            if (keyCodes[nk[0]] === c) {
                k2 = true;
            }
            if (keyCodes[nk[1]] === c && k2 === true) {
                fn();
                k2 = false;
            }
        } else if (keyCodes[nk[0]] === c) {
            fn();
        }
    };
};


keyCall('ctrl a', function() { // overridden by `keyCall('shift a'`
    alert('callback1');
});

keyCall('shift a', function() {
    alert('callback2');
});

最小限のバイト数に最適化しました。注釈付きのバージョンが役立つと思われる場合は、それを言ってください。必要なすべての人のために、ここにフィドルがあります

アップデート

パスカルフリーで直りました！しかし、別の問題が発生しています...

「プレースホルダー」変数k2は、最初のキーが押されたかどうかをチェックします。しかし、今のところ、押しctrlて離し、その後 -キーを押すとa、関数が起動します。何か案は？

4

1 に答える 1

1

onKeyPressイベントは次のようなhtml要素にバインドされていると思います。

keyCall.apply( window.body, ['shift a', function() { alert('a') }] );

追加のイベントを追加するために、イベントハンドラーがすでに定義されているかどうかを確認し、新しい関数で呼び出すことができます。

var keyCall = function(k, fn, c, e, k2, nk) {
    var oldOnkeydown = this.onkeydown; //get old event handler
    this.onkeydown = function() {
        if( typeof oldOnkeydown == "function" ) { oldOnkeydown() } //call in new eventhandler.
        nk = k.split(" ");
        c = e ? e.which : event.keyCode;
        if (nk.length > 1) {
            if (keyCodes[nk[0]] === c) {
                k2 = true;
            }
            if (keyCodes[nk[1]] === c && k2 === true) {
                fn();
                k2 = false;
            }
        } else if (keyCodes[nk[0]] === c) {
            fn();
        }
    };
    //reset k2 onkeyup
    var oldOnkeyup = this.onkeyup;
    this.onkeyup = function() {
      if( typeof oldOnkeyup == "function" ) { oldOnkeyup() }
      k2 = false;
    };
};

コメント付きの2行だけを追加しました。（+コメントからの問題を解決するための最後のonkeyupイベント）

ソース：http ：//www.webreference.com/programming/javascript/onloads/index.html

于 2012-09-17T15:33:56.357 に答える