javascript - Chrome 中的按键模拟正常触发,但不是正确的按键

标签 javascript google-chrome dom-events

我想在 html 页面中给定的 textarea 元素上模拟 keydown 事件。由于我使用的是 Chrome,因此我在变量上调用了 initKeyboardEvent ,并传递了我想要在文本区域中输入的 keyCode 。这是我尝试过的:

var keyEvent = document.createEvent('KeyboardEvent');
keyEvent.initKeyboardEvent('keydown', true, false, null, 0, false, 0, false, 77, 0);
inputNode.dispatchEvent(keyEvent);

在此代码中,我输入字母 m,但是文本区域仅获取 keyCode 13,即 Enter 键。因此,我尝试了在网上看到的覆盖代码,将值设置为 keyCodeVal,但没有成功。

var keyEvent = document.createEvent('KeyboardEvent');
Object.defineProperty(keyEvent, 'keyCode', { 
                         get : function() {
                                 return this.keyCodeVal;
                         }
                        });
keyEvent.initKeyboardEvent('keydown', true, false, null, 0, false, 0, false, 77, 0);
keyEvent.keyCodeVal = 77;
inputNode.dispatchEvent(keyEvent);

有人知道如何设置keyCode值吗?

最佳答案

非常非常接近...

您只需要覆盖“which”属性即可。这是一些示例代码:

document.addEventListener('keydown', e => console.log(
'altKey                : ' + e.altKey + '\n' +
'charCode (Deprecated) : ' + e.charCode + '\n' +
'code                  : ' + e.code + '\n' +
'ctrlKey               : ' + e.ctrlKey + '\n' +
'isComposing           : ' + e.isComposing + '\n' +
'key                   : ' + e.key + '\n' +
'keyCode (Deprecated)  : ' + e.keyCode + '\n' +
'location              : ' + e.location + '\n' +
'metaKey               : ' + e.metaKey + '\n' +
'repeat                : ' + e.repeat + '\n' +
'shiftKey              : ' + e.shiftKey + '\n' +
'which (Deprecated)    : ' + e.which + '\n' +
'isTrusted             : ' + e.isTrusted + '\n' +
'type                  : ' + e.type
));

Podium = {};
Podium.keydown = function(k) {
  var oEvent = document.createEvent('KeyboardEvent');

  // Chromium Hack
  Object.defineProperty(
    oEvent,
    'keyCode',
    {
       get : function() {
         return this.keyCodeVal;
       }
    }
  );
  Object.defineProperty(
    oEvent,
    'which',
    {
       get : function() {
         return this.keyCodeVal;
       }
    }
  );

  if (oEvent.initKeyboardEvent) {
    oEvent.initKeyboardEvent("keydown", true, true, document.defaultView,
                             false, false, false, false, k, k);
  }
  else {
      oEvent.initKeyEvent("keydown", true, true, document.defaultView,
                          false, false, false, false, k, 0);
  }

  oEvent.keyCodeVal = k;

  if (oEvent.keyCode !== k) {
    alert("keyCode mismatch " + oEvent.keyCode + "(" + oEvent.which + ")");
  }

  document.dispatchEvent(oEvent);
}

//Sample usage
Podium.keydown(65);

注意:此代码不适用于 IE、Safari 或其他浏览器。好吧,也许用火狐浏览器。 YMMV。

关于javascript - Chrome 中的按键模拟正常触发,但不是正确的按键,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10455626/

相关文章:

javascript - 如何在discord.js中制作菜单?

javascript - 用户停止单击按钮后如何调用函数?

javascript - JS HTML5 拖放 : Custom Dock Effect Jumping Around in Chrome

javascript - 通过事件监听器捕获 JS 中的错误

javascript - "Save As" Angular 应用程序中 HTML5 本地存储中的文件

google-chrome - 调整大小(按比例缩小)图像锯齿状,重绘平滑(不重新加载)

google-chrome - 关闭 Chrome 扩展选项

javascript - 在 <body> 部分中通过 Javascript 添加 body.onload 的事件处理程序

javascript - 指令内未触发滚动事件 - angular.js

php - 如何提交字段名重复的表单数据?