当前位置: 首页 > 知识库问答 >
问题:

如何防止按键事件中断jQuery中的按键事件?[副本]

陆仲渊
2023-03-14

可能的重复:
跨浏览器方式,以便在按住键时自动获取重复的按键事件

我正在尝试用JavaScript/CSS/超文本标记语言创建一个简单的游戏,我正在使用jQuery(和一点下划线)来处理按键。玩家使用箭头键控制一个块。我在同时处理多个按键时遇到了问题。我有一个系统,其中闭包跟踪所有按下的箭头键。如果玩家按以下顺序按键,这个效果很好:

  1. 玩家按下(块向下移动)
  2. 玩家按下左(块对角线向下移动-左)
  3. 玩家释放向下(块向左移动)
  4. 玩家释放左(块停止

但是,如果步骤3和4颠倒,则块会停止。这是在这种情况下实际发生的情况:

    < li >玩家按下(方块向下移动) < li >玩家向左按(方块沿对角线向左下方移动) < li >玩家向左释放(阻挡停止)

预期的行为是,在步骤 3 中,块将继续向下移动,而不是完全停止。

从我在代码中输入的痕迹来看,似乎一个keyup事件实际上停止了进一步keydown事件的传播,即使我的手指仍然按住一个箭头键。

下面是相关代码的片段。谁能告诉我问题可能出在哪里?

// Creates an animation handler for a specific element.
// Animation reacts to any changes as they are submitted
var getMovementAnimator = function(element) {
    var params = {},
        $element = $(element);
    return function(changes) {
        _.each(changes, function(val, key) {
            // Remove null or zeroish keys from animation params
            if ( (val == 0 || !val) && _.has(params, key)) {
                delete params[key];
            } else {
                params[key] = '+=' + val + 'px';
            }
        });
        $element.animate(params, {duration: 0, queue: false});
        console.log(params);
    };
};

// Determines direction and speed of movement for an element
// after a keypress event
var getMovementChange = function(keyEvent, keydown) {
    var isMoving = !!keydown,
        params   = {},
        dir      = '',
        speed    = keydown ? 5 : 0,
        arrows   = {left: 37, up: 38, right: 39, down: 40};
    switch (keyEvent.which) {
        case arrows.left:
            dir = 'left';
            speed = -speed;
            break;
        case arrows.up:
            dir = 'top';
            speed = -speed;
            break;
        case arrows.right:
            dir = 'left';
            break;
        case arrows.down:
            dir = 'top';
            break;
    }
    // If key hit not one of above, do nothing
    if (!dir) {
        return false;
    }
    if (!speed) {
        console.log('key up: ', dir);
    }
    params[dir] = speed;
    return params;
}

// Sets up key handlers
$(document).ready(function() {
    var board = $('#board'),
        animatePlayer = getMovementAnimator('.player');
    $(document).keydown(function(e) {
        e.preventDefault();
        var changes = getMovementChange(e, true);
        animatePlayer(changes);
    }).keyup(function(e) {
        e.preventDefault();
        var changes = getMovementChange(e, false);
        animatePlayer(changes);
    });
});

共有1个答案

陆文斌
2023-03-14

对堆栈溢出的进一步搜索(使用正确的关键字)表明,我看到的问题实际上不是我代码中的一个bug。相反,这是操作系统的预期行为。

但是,我找到了一个解决方法,我相信可以解决问题。

 类似资料:
  • 嗨,在用pygame开发游戏时,有一个问题其实并不重要,但它一直困扰着我一段时间。 所以上面是一个工作代码,我相信 同样有效。 然而,当我只是尝试类似“event.key==pyplay。K_RIGHT:",python给我一个错误,说没有属性'key'。虽然我知道选择以上2个代码会更合理,而不仅仅是“event.key==pyplay。K_RIGHT:",我不知道为什么pyplay会说事件没有属

  • 我正在使用Microsoft Visual C#2010 Express编写一个窗口窗体应用程序。我在写一个数独程序。我以前写过一次这个程序,并让它工作。由于硬盘故障,我丢失了源代码。我在表格上画了一个网格。我让鼠标事件工作了。我有重要的新闻活动要办。然后我在表单中添加了几个按钮,并让它们工作。但随后出现了一个问题。在我添加按钮并使其工作后,按键事件停止工作。为什么按钮事件和按键事件之间会发生冲突

  • 问题内容: 是否有可能结合按键的组合来触发单个事件? 我已经在Chrome浏览器中尝试过,但该事件不会触发。 称我为疯狂,但我正在编写Chrome扩展程序,并希望同时按下+ + 键将其强制为隐藏的开发人员模式。 问题答案: 如果要检测的,和钥匙都在同一时间全部下来,你得看都和并保持地图为down的那些的。当他们全都崩溃时,请触发您的事件。 我假设您不关心它们按什么顺序按下(因为要可靠地按一下会很痛

  • 我想在下面的文本框中捕捉enter键按下事件。为了更清楚地说明这一点,我使用了一个ng repeat来填充tbody。以下是HTML: 这是我的模块: 我正在使用资源填充表格,我的控制器代码是:

  • 问题内容: 我想在下面的文本框中捕获Enter键按下事件。为了更清楚地说明,我使用a 来填充tbody。这是HTML: 这是我的模块: 我正在使用一种资源来填充表,而我的控制器代码是: 问题答案: 您需要添加,如下所示: Javascript : HTML :

  • 仅限GXT 3. x。 我越来越清楚,Sencha故意设计了FileUploadField,以避免所有按键事件被检测到。 我试图拦截onBrowserEvent(事件),但无法检测到我在专注于FileUploadField组件时通过按键生成的任何按键事件。 按键事件分流器在哪里? 我找不到任何按键处理程序插入方法。 我希望通过按空格键或回车键来触发文件上传。 除了从头开始重写一个全新的组件,有人能