1

ここで何が間違っているのか考えてみてください。それを理解することはできません...それはarr等しいではないと言います[17, 67]

var key = function(keys, fn) {
    var arr = [];
    $(document).on({
        keydown: function(e) {
            arr.push(e.which);
            if (arr === keys) {
                fn();
            }
        },
        keyup: function() {
            arr = [];
        }
    });
};

// ctrl + c
key([17, 67], function() {
    alert(true);
});

これがフィドルです

アップデート

Cymenの答えは機能するので、+を押してctrlから+ +aをctrl押すaltかa、またはその逆の場合、機能するために2番目のショートカットを2回起動する必要があります。

新しいフィドル。

var key = function(keys, fn) {
    var arr = [];
    $(document).on({
        keydown: function(e) {
            arr.push(e.which);
            for (var i = 0; keys[i]; i++) {
                if (arr[i] !== keys[i]) {
                    return false;
                }
            }
            fn(e);
            arr = [];
        },
        keyup: function() {
            arr = [];
        }
    });
};

// ctrl + c
key([17, 67], function() {
    alert(true);
});

// ctrl + alt + c
key([17, 18, 67], function() {
    alert('ctrl+alt+c');
});
4

1 に答える 1

4

===配列がコンテンツと等しいかどうかを確認するために使用することはできません。JavaScriptコンソールでチェックしてください：

[17, 35] === [17, 35]
false

a = [17, 35]
[17, 35]
a === a
true

したがって===、配列では、値ではなく参照をチェックしています。アンダースコアのような他の何かを使用して比較を行うか、それが何らかの課題である場合は自分で書くことができます。または、2つの要素のみを比較しているため、次のようにします。

var key = function(keys, fn) {
    var arr = [];
    $(document).on({
        keydown: function(e) {
            arr.push(e.which);
            if (arr[0] === keys[0] && arr[1] === keys[1]) {
                fn();
                arr = [];  // added this to avoid buggyness
            }
            console.log(arr);
            console.log(keys);
        },
        keyup: function() {
            arr = [];
        }
    });
};

// ctrl + c
key([17, 67], function() {
    alert(true);
});​

http://jsfiddle.net/9LbsD/

CTRL + ALT+Cのような3つ以上のキーの場合

You need an array comparison that works for variable lengths like this one:

var equalArrays = function(array1, array2) {
    if (array1.length != array2.length) {
        return false;
    }
    for (var i=0; i < array1.length; i++) {
        if (array1[i] !== array2[i]) {
            return false;
        }
    }
    return true;    
}

var key = function(keys, fn) {
    var arr = [];
    $(document).on({
        keydown: function(e) {
            arr.push(e.which);
            console.log('arr', arr, 'keys', keys, 'match', equalArrays(arr, keys));
            if (equalArrays(arr, keys)) {
                fn();
                arr = [];                
            }
            console.log(arr);
            console.log(keys);
        },
        keyup: function() {
            arr = [];
        }
    });
};

// ctrl + c
key([17, 67], function() {
    alert(true);
});

// ctrl + alt + c
key([17, 18, 67], function() {
    alert('ctrl+alt+c');
});

http://jsfiddle.net/WZLut/

バグの少ないアプローチ

どのキーが押されたかを追跡する必要がありますが、1つのキーは1つの組み合わせで1回しか押すことができず（私が想定しています）、キーアップでは、すべてのキーではなく、上にあるキーのみを削除する必要があります。したがって、これに対する実用的なアプローチは次のとおりです。

var equalArrays = function(array1, array2) {
    return _.isEqual(array1, array2);
}

var key = function(keys, fn) {
    var arr = [];
    $(document).on({
        keydown: function(e) {
            arr = _.without(arr, e.which);
            arr.push(e.which);
            if (equalArrays(arr, keys)) {
                fn();             
            }
        },
        keyup: function(e) {
            arr = _.without(arr, e.which);
            arr = _.uniq(arr);
        }
    });
};

// ctrl + c
key([17, 67], function() {
    alert('ctrl+c');
});

// ctrl + alt + c
key([17, 18, 67], function() {
    alert('ctrl+alt+c');
});

</ p>

http://jsfiddle.net/BgQUA/

于 2012-12-02T19:13:37.800 に答える