以编程方式模拟空格键,然后在文本输入字段上模拟退格键



我想在文本输入字段上调度用户操作。我希望它就像一个真实的人使用他们的键盘单击文本输入字段,按空格键,然后点击退格键。使用我使用的代码什么也没发生。

JSFIDDLE https://jsfiddle.net/zvrhfq9j/

目录

<input type="text" name="psychTree-savedNodes" style="width:20%" />

JS的

$('input[name="psychTree-savedNodes"]').focus();
$('input[name="psychTree-savedNodes"]').trigger({type: 'keypress', which: 32, keyCode: 32});
$('input[name="psychTree-savedNodes"]').trigger({type: 'keyup', which: 32, keyCode: 32});
$('input[name="psychTree-savedNodes"]').trigger({type: 'keydown', which: 32, keyCode: 32});
$('input[name="psychTree-savedNodes"]').trigger({type: 'keypress', which: 8, keyCode: 8});
$('input[name="psychTree-savedNodes"]').trigger({type: 'keyup', which: 8, keyCode: 8});
$('input[name="psychTree-savedNodes"]').trigger({type: 'keydown', which: 8, keyCode: 8});

解决方案:是实际调度事件。感谢那些实际回答的人!

您可以模拟用户操作,但它们不会执行默认功能,因为它会将isTrusted设置为 false(出于安全原因(。

例如,您可以构建一个事件以调度到"键入字母'a'"的文本字段。它将(错误,应该(触发绑定到该事件处理程序(el.onkeydown(e){ if( e.key == 'a' ) …(的任何自定义函数,但它不会在文本字段中键入字母a,也不会根据该击键处理默认浏览器功能。

这是一个浏览器实现,不是你可以绕过的东西。因此,虽然不能直接在字段中"键入",但可以根据附加到这些特定事件的事件处理程序运行事件。

我举了一个代码笔示例来说明我的意思:https://codepen.io/xhynk/pen/jOPbWzz

  • 页面加载蓝色,包含 2 个字段
  • 在 1 秒内,它将运行一个函数,该函数"模拟"单击>空间>退格键"的事件链。
  • 事件将显示它们在"no"输入中执行的操作
  • 页面变为绿色以显示它已关闭。

如果您愿意,可以将事件代码更改为字母,以查看实际击键永远不会出现在"是"输入中。我添加了"no"框,其中包含keydownonclick事件处理程序,以通过更改事件的value来显示触发的事件以及以什么顺序触发。

您也可以手动单击"yes"输入,然后点击"space"和"backspace",然后看到它们也会触发事件处理程序函数(事件函数将像模拟时一样运行(,但这次它们实际上会显示在框中(因为你确实做了它们,所以它们是受信任的事件(。

长话短说,您无法完全模拟受信任的"键入"按键事件,但您可以根据需要处理这些特定的按键事件(如果您愿意,甚至可以更改当前输入的值(。

编辑:我看到一连串的评论在顶部生成。这是一个您无法绕过的浏览器功能,除非您找到(或构建(处理不受信任isTrusted:false事件的浏览器。这与本地或沙盒编程环境没有任何关系。

最新更新