0

在具有以下代码的页面上按 enter 时，页面将进入全屏并锁定指针。移动鼠标将导致“mousemove”输出到控制台。关键事件工作正常，尽管我已经在全屏中删除了关键事件以简化示例。我的问题是，如果按住任何键然后移动鼠标，则不会触发 mousemove 事件。这对于全屏第一人称体验来说是个问题，因为这意味着用户不能同时移动和观看！在 Firefox 23 和 Chrome 29、30 和 31 中测试。

更新：这只发生在我的戴尔 Latitude E6510 上的集成触摸板和/或笔尖上。如果我插入 USB 鼠标，它似乎工作正常。

对为什么会发生这种情况和/或如何解决它的想法表示赞赏。

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
  </head>
  <body>
    <script>
var isPointerLockSupported = 'pointerLockElement' in document || 'mozPointerLockElement' in document || 'webkitPointerLockElement' in document;
var isFullScreenSupported = 'fullScreenEnabled' in document || 'mozFullScreenEnabled' in document || 'webkitFullscreenEnabled' in document;

function rPL(element, onEnter) {
  var pointerlockchange = function (event) {
    if (document.pointerLockElement === element || document.mozPointerLockElement === element || document.webkitPointerLockElement === element) {
      onEnter.call(element, event);
    }
    else {
      document.removeEventListener('pointerlockchange', pointerlockchange, false);
      document.removeEventListener('mozpointerlockchange', pointerlockchange, false);
      document.removeEventListener('webkitpointerlockchange', pointerlockchange, false);
    }
  };
  document.addEventListener('pointerlockchange', pointerlockchange, false);
  document.addEventListener('mozpointerlockchange', pointerlockchange, false);
  document.addEventListener('webkitpointerlockchange', pointerlockchange, false);

  element.requestPointerLock = element.requestPointerLock || element.mozRequestPointerLock || element.webkitRequestPointerLock;
  element.requestPointerLock();
}

function rFS(element, onEnter) {
  var fullscreenchange = function(event) {
    if (document.fullScreenElement || document.mozFullScreenElement || document.webkitFullscreenElement) {
      onEnter.call(element, event);
    }
    else {
      document.removeEventListener('fullscreenchange', fullscreenchange, false);
      document.removeEventListener('mozfullscreenchange', fullscreenchange, false);
      document.removeEventListener('webkitfullscreenchange', fullscreenchange, false);
    }
  }
  document.addEventListener('fullscreenchange', fullscreenchange, false);
  document.addEventListener('mozfullscreenchange', fullscreenchange, false);
  document.addEventListener('webkitfullscreenchange', fullscreenchange, false);

  element.requestFullScreen = element.requestFullScreen || element.mozRequestFullScreen || element.webkitRequestFullScreen;
  element.requestFullScreen(typeof Element.ALLOW_KEYBOARD_INPUT === 'undefined' ? undefined : Element.ALLOW_KEYBOARD_INPUT);
}

document.addEventListener('mousemove', function() {
  console.log('mousemove');
}, false);

document.addEventListener('keydown', function(e) {
  if (e.keyCode == 13 && isFullScreenSupported && isPointerLockSupported) {
    var instructions = this;
    rFS(document.body, function() {
      rPL(document.body, function() {});
    });
  }
}, false);
    </script>
  </body>
</html>
4

1 回答 1

0

触摸板唯一的问题是你的线索。尝试捕获 ommousedown 和 onmouseup 事件。您的事件之一是触发这些行为，因此您不希望事件在鼠标按下时触发 - 只是 onclick 或 onmouseup 事件。

于 2014-03-11T23:41:50.207 回答