Javascript

Question

我有这段代码：

window.addEventListener('keydown', function (e) { 
   console.log(e.which); 
   console.log(e.keyCode); 
});

 var evObj = new KeyboardEvent('keydown', {key:65});
 window.dispatchEvent(evObj);

为什么我在控制台中看到的是 0 而不是 65 ??

此外 e.keyCode 和 e.which 都是 0 而不是 65，我使用的是 Chrome 最新版本

非常感谢。

Answer 1

Also both e.keyCode and e.which are 0 and not 65, i am on Chrome latest version

因为您设置的是 key，而不是 keyCode 和 which。 According to MDN, key is a representation of the key, not a keycode. To initialize keyCode and/or which, you should...do that (see MDN's article on KeyboardEvent).

var evObj = new KeyboardEvent('keydown', {keyCode:65, which:65});

这是一个示例，但它似乎在 Chrome 中不起作用（仍然得到 0）——这是一个 Chrome 错误，解决方法如下。在 Firefox 中工作。在 IE11 中失败，因为 IE11 不喜欢 new KeyboardEvent:

window.addEventListener("keydown", function(e) {
  snippet.log("keyCode = " + e.keyCode + ", which = " + e.which);
}, false);
setTimeout(function() {
  var evObj = new KeyboardEvent('keydown', {keyCode:65, which:65});
  snippet.log("Sending event");
  window.dispatchEvent(evObj);
}, 300);

<!-- Script provides the `snippet` object, see http://meta.stackexchange.com/a/242144/134069 -->
<script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script>

您可以使用 the technique from this answer:

解决 Chrome 错误

window.addEventListener("keydown", function(e) {
  snippet.log("keyCode = " + e.keyCode + ", which = " + e.which);
}, false);
setTimeout(function() {
  var evObj = new KeyboardEvent('keydown', {keyCode:65, which:65});
  // Chrome bug workaround:
  if (evObj.keyCode != 65) {
    Object.defineProperty(evObj, "keyCode", {
      value: 65
    });
    Object.defineProperty(evObj, "which", {
      value: 65
    });
  }
  snippet.log("Sending event");
  window.dispatchEvent(evObj);
}, 300);

<!-- Script provides the `snippet` object, see http://meta.stackexchange.com/a/242144/134069 -->
<script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script>

Answer 2

注意：在 Firefox 中，keyCode 属性对 onkeypress 事件不起作用（只会 return 0）。对于跨浏览器解决方案，请将 which 属性与 keyCode 一起使用，例如：

var x = event.which || event.keyCode;  // Use either which or keyCode, depending on browser support

Answer 3

chrome 中存在错误，keyCode 和 which 不可配置。

可能的解决方法：定义自定义 getter

 window.addEventListener('keydown', function (e) { console.log(e.which); });
 
 (function(o,k){
    //use createEvent for better compatibility
   var evObj = document.createEvent('HTMLEvents');
    evObj.initEvent('keydown', true, false);
    Object.defineProperty(evObj, 'keyCode', {
      get: function() {
        return k;
      }
    });
    Object.defineProperty(evObj, 'which', {
      get: function() {
        return k;
      }
    });
    o.dispatchEvent(evObj); 
 }(window,65));

Javascript - 触发特定的键盘按键

Javascript - trigger specific keyboard keys

keyboard

events

triggers