11

私はこの男のHow to disable repetitive keydown in jQueryのような同じ問題を抱えています.jQueryを使用していないだけなので、それを「純粋な」JavaScriptに変換するのに苦労していswitchます.右矢印キーを押したままにすると、div が飛んでいます。また、問題がなければ、右矢印キーを離したときに div の動きを止める最も簡単な方法を教えてください。またはで新しいスイッチケースを作成する必要がありclearIntervalますか?

switch (keyPressed) {
    case 39:
        setInterval(movFwr, 50);
        break;
}

function movFwr() {
    if (currPos == 1000) {
        a.style.left = 1000 + "px";
    } else currPos += 10;
    a.style.left = trenutnaPozicija + "px";
}

申し訳ありませんが、私は少し忙しく、すべての可能性をテストしており、これまでのところいくつかの興味深い提案を見てきました。私はこれらすべての日をテストし、このサイトであなたが何をしているかを評価します. 私が言わなければならない素晴らしいコミュニティ。ご協力ありがとうございました:)

4

4 に答える 4

20

このような方法でうまくいくはずです。

var down = false;
document.addEventListener('keydown', function () {
    if(down) return;
    down = true;

    // your magic code here
}, false);

document.addEventListener('keyup', function () {
    down = false;
}, false);
于 2013-07-07T18:10:11.273 に答える
2

時間を記録し、十分な時間が経過しない限りアクションを防止します。たとえば、Date.now

var lastPress = 0;

function myListener() {
    var now = Date.now();
    if (now - lastPress < 1000) return; // less than a second ago, stop
    lastPress = now;
    // continue..
}

これは、より一般的な関数にすることができます

function restrict(func, minDuration) {
    var lastPress = 0;
    return function () {
        var now = Date.now();
        if (now - lastPress < minDuration) return; // or `throw`
        lastPress = now;
        return func.apply(this, arguments);
    };
}
// now, for example
foo = function () {console.log('foo');};
bar = restrict(foo, 200); // only permit up to once every 200ms
bar(); // logs "foo"
bar(); // void as less than 200ms passed
于 2013-07-07T18:12:25.163 に答える
1

keydownキーの繰り返しによって発生したキー イベントを無視するには、およびイベント中にどのキーが押されたかを追跡しkeyupます。

var pressedKeys = [];
function keydownHandler(e) {
    var isRepeating = !!pressedKeys[e.keyCode];
    pressedKeys[e.keyCode] = true;
    switch (e.keyCode) {
        case !isRepeating && 39:
            // do something when the right arrow key is pressed, but not repeating
            break;
    }
}
function keyupHandler(e) {
    pressedkeys[e.keyCode] = false;
}

div の移動を停止するには、配列内の間隔 ID を追跡し、keyupイベント中に のようなもので間隔をクリアできますが、代わりにキーが押されているかどうかclearInterval(intervalIds[e.keyCode])を使用して確認することに切り替えます。setTimeout()そうすれば、別の変数を追跡する必要がなくなります。

var pressedKeys = [];
function keydownHandler(e) {
    var isRepeating = !!pressedKeys[e.keyCode];
    pressedKeys[e.keyCode] = true;
    switch (e.keyCode) {
        case !isRepeating && 39:
            movFwr();
            break;
    }
}
function keyupHandler(e) {
    pressedkeys[e.keyCode] = false;
}
function movFwr() {
    if (pressedKeys[39] && currPos < 1000) {
        currPos += 10;
        a.style.left = currPos + "px";
        setTimeout(movFwr, 50);
    }
}

このようにして、ユーザーが矢印キーを放すのを待つのではなく、div が右端に到達するとすぐに関数の繰り返しを自動的に停止します。

于 2013-07-07T20:33:33.357 に答える
0

最後に押されたキーを追跡し、現在と同じ場合は無視して戻り、clearInterval間隔を停止するために使用します

//global variables
var lastKey = 0;
var moveTimer = [];

//in keydown function
if(lastKey == keyPressed)
    return;
switch (keyPressed) {
    case 39:
        lastKey = keyPressed
        moveTimer[keyPressed] = setInterval(movFwr, 50);
        break;
}


//in a onkey up function
lastKey = null;
if(typeof(moveTimer[keyPressed]) != "undefined")
    clearInterval(moveTimer[keyPressed]);
于 2013-07-07T18:12:10.493 に答える