【问题标题】:Sending keyboard events programmatically doesn't dispatch them into inputs以编程方式发送键盘事件不会将它们分派到输入中
【发布时间】:2017-07-31 09:51:47
【问题描述】:

我正在向文档发送以编程方式生成的键盘事件。我希望当前聚焦的输入元素会显示它们,但事实并非如此。使用此函数从字符串生成事件:

const simulateKeyPress = keys => {
  keys.split('').forEach(theKey => {
    const e = new window.KeyboardEvent('keypress', {
      bubbles: true,
      key: theKey,
      keyCode: theKey.charCodeAt(0),
      charCode: theKey.charCodeAt(0),
    })
    document.dispatchEvent(e)
  })
}

如果我将 EventListener 添加到文档中,它将接收所有事件。他们的 isTrusted 标志设置为 false 但是,这可能是问题吗?

【问题讨论】:

    标签: javascript input keyboard-events


    【解决方案1】:

    无法通过网站以编程方式完成。就像你说的 isTrusted boolean as false 不会正确触发按键(自 Chrome 53 起):https://developer.mozilla.org/en/docs/Web/API/Event/isTrusted

    我试图在这里解决这个问题:https://codepen.io/zvona/pen/LjNEyr?editors=1010

    实际上唯一的区别是为activeElement 发送事件,例如:document.activeElement.dispatchEvent(e);。此外,如果您能够挂钩输入的事件,您可以添加事件监听器来完成这项工作:

    input.addEventListener('keypress', (evt) => {
      evt.target.value += evt.key;
    });
    

    但如前所述,这不是受信任的事件。但是,这可以通过浏览器扩展来完成(参见:How to to initialize keyboard event with given char/keycode in a Chrome extension?

    【讨论】:

    • 嗨,您是否偶然对“不会正确触发按键(自 Chrome 53 起)”有一些参考。有说法吗?支持isTrusted 属性真的意味着那个吗?
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2015-01-15
    • 2013-10-04
    • 2016-07-15
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2011-03-06
    相关资源
    最近更新 更多