如何在纯 javascript 中手动触发按键事件时设置键码值？

Question

我是 Javascript 的新手，虽然我已经很好地使用了 JQuery。但我找不到更好的文档来执行此操作。仅当我按下回车键时才需要触发点击事件。所以我需要为这个场景编写测试用例。

function btnRepeatKeyDownEvent(e){
        if (e.keyCode === 13) {
            this.trigger('click', e);
        }
}

到目前为止我已经找到了这个解决方案。

let keyboardEvent: KeyboardEvent = new KeyboardEvent('keypress', {'key': 'Enter'});
document.dispatchEvent(keyboardEvent);

但是上面的代码总是给键码值0。我更厌倦了寻找解决方案。根据 MDN，大部分功能已弃用。我需要使这个测试用例在 chrome、firefox 和 IE11+ 中可用，但不适用于旧 browsers.Please 帮助我。

Answer 1

keyCode 和其他属性是只读的。因此，您可以伪造它，利用 JavaScript 的 Object.defineProperties 函数覆盖值：

function makeKeyPressEvent(keyName, keyCode, charCode){
    var event = new KeyboardEvent('keypress');
    Object.defineProperties(event, {
        charCode: {value: charCode},
        keyCode: {value: keyCode},
        keyIdentifier: {value: keyName},
        which: {value: keyCode}
    });
    return event;
}

使用方法如下：

window.addEventListener('keypress', function(event){console.log('key pressed!', event.keyIdentifier, event.keyCode, event.charCode, event)}, true);

var enterKeyEvent = makeKeyPressEvent('Enter', 13, 13);

window.dispatchEvent(enterKeyEvent);

如何在纯 javascript 中手动触发按键事件时设置键码值？

how to set keycode value while triggering keypress event manually in pure javascript?

javascript

keypress

keyboard-events