Question

当某人持有修改键（Shift，Alt，Ctrl）时，我的应用会更改其状态。我使用keydown / keyup事件跟踪修饰键：

var altPressed;
window.onkeydown = window.onkeyup = function(e) {
    altPressed = e.altKey;
}

键盘事件不会在浏览器选项卡外触发。现在，想象一下以下场景：

按住Shift键
点击我的应用程序的链接，它将在新窗口中打开
释放Shift键

keyup事件在我的页面没有聚焦时不会触发，所以当我再次专注于我的应用程序选项卡时，我的应用程序会显示它仍会显示Shift键仍然被按下。

如果page visibility events具有修饰键属性，那将会很好。唉，他们没有。

document.addEventListener('webkitvisibilitychange', function(e) {
    if (document.webkitHidden) return;

    e.altKey // undefined :(

}, false);

Answer 1

到目前为止我最好的出现了：

document.body.onkeydown = function(e) {
  if (e.which === 18) {
    alt_state.textContent = 'pressed';
  }
};

document.body.onkeyup = function(e) {
  if (e.which === 18) {
    alt_state.textContent = 'released';
  }
};

function detectAlt() {
  if (document.webkitHidden) return;
  window.addEventListener('mousemove', function onMove(e) {
    alt_state.textContent = e.altKey ? 'pressed' : 'released';
    window.removeEventListener('mousemove', onMove, false);
  }, false);
}

document.addEventListener('webkitvisibilitychange', detectAlt, false);
window.addEventListener('load', detectAlt, false);

按alt键并点击链接： jsbin 。

它依赖于mousemove事件，与load和visibilitychange事件不同，它具有altKey属性。作为缺点，在人移动鼠标之前，它不会检测到altKey。

Answer 2

我可以想到两个选项：

使用定时“alt status” - ＆gt; 2秒后声明alt未按下。

document.body.onkeydown = function(e) { if (e.which === 18) { alt_state.textContent = 'pressed'; setTimeout(function(){ alt_state.textContent= ""; },2000); } };

当可见性丢失时，只需重置所有alt标志。

document.addEventListener('webkitvisibilitychange', function(e) {
    if (document.webkitHidden){
        altPressed = "";
        return;
    }
}, false);

试试这个：http://jsbin.com/jihuyibu/1/edit 这是我最好的猜测，即便如此，它也永远不会完美。

检测按下的修改键而不触发键盘或鼠标事件

2 个答案: