3

我有一个关于 JS 中的键盘事件的问题。

首先，请不要回答我使用 jQuery 方法，我知道其中的大部分（绑定/取消绑定，开/关，一个......）但我使用的内部框架必须在没有 jQuery 的情况下工作，即使 jQuery用于我们的大多数项目。

所以，我有一个模块，实际上是一个基于Swipe.js的滑动工具，并扩展为在 Web 和移动环境中工作（IE 7+、WebKit（Chrome 和 Safari）、Moz、Opera 和 IE10 / Windows Phone 所需的兼容性）

在鼠标/触摸事件没有任何问题的情况下，受移动 HTML5 BP启发的绑定和解除绑定方法似乎可以很好地工作，并对 detachEvents 方法进行小幅修正。

然后我会根据“keydown”事件实现键盘控制功能。（顺便说一句，我不确定 keydon 和 keypress 事件之间是否有很好的区别，除了 keypressEvent.preventDefault() 不会阻止小滚动效果，所以我使用 keydown。）

由于可以在同一页面上添加许多 Swipe，因此我仅在任何 Swipe 获得焦点时才开始监听 keydown 事件（请注意，我添加了一个“tabindex”属性以允许元素获得焦点）。

<div id="swipe1" class="swipe" tabindex='0'>
    <ul>
        [...]
    </ul>
</div>

然后，当 Swipe 处理“touchstart”/“click”/“MSPointerDown”事件时，我将其聚焦：

onTouchStart: function(e) {
    this.container.focus(); // Refers to the div#swipe1.swipe element
    [...]
    return false;
}

onFocus: function (e) {
    if (this.activateKeyboardControls) { // Keyboard control is optional
        this.addListener(document, 'keydown', this, true);
    }
}

onBlur: function (e) {
    if (this.activateKeyboardControls) { // Keyboard control is optional
        this.removeListener(document, 'keydown', this, true);
    }
}

但不幸的是，removeListener 不起作用。

我的意思是，当元素失去焦点（触发模糊事件）时，它仍然处理 keydown 事件......

是因为它绑定在文档对象上吗？我已经阅读了一些使用一些布尔值的解决方案，但我正在寻找一种更清洁的方式来管理它。

这很烦人，因为当我将焦点放在许多滑动上时，当我按下键盘时，它们中的每一个都在滑动。

4

1 回答 1

1

我不确定我的答案被删除的原因 - 发布后超过 2 周 - 但无论如何，这就是我解决它的方法：

它来自 addEventListener / attachEvent 方法的“类型”参数，第一个，所以......

我将它绑定在对象上而不是窗口上，并且没有冒泡。

var target = e.target || e.srcElement;
if (this.activateKeyboardControls) {
    this.addListener(target, 'keydown', this, false);
}
于 2013-04-09T10:13:10.180 回答