Question

我正在为我的框架制作一个需要使用shift密钥测试事件的规范。所以我想实际插入一个!，就好像我按了shift + 1。

我一直在使用Syn框架但无法模拟SHIFT + 1。 According to the docs它应该是

Syn.type('[shift]1[shift-up]', 'textInput2');

但这不起作用。我希望!字符event.shiftKey为true，和 event.key为33但我得到{ {1}}而不是1和!。

如何使用Syn或vanilla javascript实现这一点？

我made this jsFiddle要对此进行测试，请检查控制台。

Answer 1

如果你在这里查看Syn Tests https://github.com/bitovi/syn/blob/c77ae2cbb19ff0a5d3ecd3f9968e15adad289a79/test/qunit/key_test.js

你可以看到他们模拟了一个资本＆＃39; A＆＃39;通过做[转移] A [升级]＆＃39;。 Syn只是创建一个事件并传递和设置值。它不会模拟较低级别的键盘交互。

 Syn.type('[shift]![shift-up]', 'textInput2');
 // outputs 33 true

设置超时会使其工作，不确定原因，但确实如此：http://jsfiddle.net/2zsNV/5/

Answer 2

好的，你纠正了Syn没有正确地做到这一点，我可以猜到为什么 - 浏览器无法告诉你的键盘布局（见这里：detect keyboard layout with javascript）所以它真的无法说明你应该为Shift + 1获得什么，所以它只给你一个＆＃39; 1＆＃39;。

你会认为

Syn.type('[shift]![shift-up]', 'textInput2');

会按预期工作，但也不会......我认为这是Syn中的一个错误。

那么，你能用原始JavaScript做到吗？我可以靠近

显然很难让它跨浏览器工作，这让我陷入了尝试不同事物的兔子洞。首先我查看了这个问题：Is it possible to simulate key press events programmatically?但是在chrome中没有正常工作，然后我根据文档尝试了各种事件和值组合，但没有取得多大成功。然后我发现了这个问题：Firing a keyboard event on Chrome这导致了我code。

将该代码粘贴到JS中，然后使用：

调用它

var e = crossBrowser_initKeyboardEvent("keypress", {"key": 1, "char": "!", shiftKey: true})
document.getElementById('textInput2').dispatchEvent(e);

将提供您期望的输出。然而，它实际上并没有将值写入输入框。当然你可以伪造它并且只是在那里添加文本，我不确定这是否是事件工作方式的限制或者代码是否有问题。当然，对于测试，这可能就是你所需要的。

这里是fiddle，也许其他人可以进行最后的跳跃。

模拟shift + 1键盘事件并在事件处理程序中检索它

2 个答案: