Question

我遇到了一个我正在撰写的小型Chrome扩展程序的问题。基本上问题是我需要在输入字段中模拟keydown事件，以便目标站点将使用其侦听器来获取它。

要查找侦听器，我为所有键盘事件设置了一个事件侦听器断点，然后输入到输入字段中。我必须逐步完成3个断点，全部用于Keyboard-＆gt; keydown事件。以下是他们的基本信息：

Arguments: Arguments[1]
E: KeyboardEvent
This: input#header-search.form-control

Arguments: Arguments[1]
E: KeyboardEvent
This: document

Arguments: Arguments[1]
E: KeyboardEvent
This: Window

我尝试过使用keyboardevents没有运气，也许我还没有正确地完成它们（它很难找到Chrome中keyboardevents的文档）或者我可能需要走另一条路线。非常感谢任何帮助，谢谢！

Answer 1

您需要在扩展程序使用的网页上下文中触发事件。这对我有用。

在网页中注入jQuery。
我正在使用这个jQuery扩展：https://github.com/jquery/jquery-simulate 也可以在网页中注入它。
在注入脚本之前，我用jQuery重命名所有$次出现的原因是不要与网页脚本产生冲突。

您可以使用以下模式注入脚本（还有其他注入js的方法）：

在扩展程序的内容脚本中添加以下功能

function injectJQuery() {
  var s = document.createElement('script');
  s.textContent = '(' + function() {
    //paste jQuery plugin here 
  } + ')()';
}

然后注入模拟扩展的相同模式

function injectJQuerySimulate() {
  var s = document.createElement('script');
  s.textContent = '(' + function() {
    //paste jQuery simulate plugin here 
  } + ')()';
}

当你的扩展程序的内容脚本运行时，调用这两个函数一次，以便在网页中注入脚本。

现在，您可以使用以下函数将jQuery simulate插件的keydown事件发送到网页：

function sendKeydown(elemId, keyCode) {
  var s = document.createElement('script');
  s.textContent = '(' + function(elemId, keyCode) {
    jQuery(elemId).simulate('keydown', {
      keyCode: keyCode
    });
  } + ')("' + elemId + '", "' + keyCode + '");';
  (document.head || document.documentElement).appendChild(s);
  s.parentNode.removeChild(s);
}

使用示例：

sendKeydown('#SomeElementId', 37); //37 is the keyCode for left arrow key

ASCII密钥代码的参考表：http://www.cambiaresearch.com/articles/15/javascript-char-codes-key-codes

Chrome扩展程序中的JavaScript - 创建Keydown事件

1 个答案: