使用 JavaScript 函数在输入上触发 Keydown（无 jQuery）答案

【问题标题】：Trigger Keydown on input with JavaScript function (no jQuery)使用 JavaScript 函数在输入上触发 Keydown（无 jQuery）
【发布时间】：2018-08-16 23:44:29
【问题描述】：

如何使用 vanilla javascript 模拟“右箭头”键的按键输入？

我有一个输入和一个按钮。我希望该按钮触发输入上“右箭头”键的按键。

 <input id="myInput" type="text">
 <button id="myButton>Click Me</button>

基本上，最终结果应该是：

点击按钮
光标向右移动一位（因为我们触发了按键）

我已经尝试了这些解决方案，但它们不起作用：

Is it possible to simulate key press events programmatically?

https://elgervanboxtel.nl/site/blog/simulate-keydown-event-with-javascript

【问题讨论】：

请参阅此页面，了解您需要做什么的工作示例。 snipplr.com/view/5144/getset-cursor-in-html-textarea
@ScottMarcus 你是对的
如果您单击一个按钮并启动一个右箭头键事件，为什么您会期望光标在一些不相关的文本输入字段中移动？焦点将在按钮元素上，因此该元素上的键可能会尝试向右滚动页面（或类似的东西）。如果您尝试启动一个关键事件，您的链接会向您展示如何执行此操作，但我不希望这能立即解决您的光标定位问题。如果您尝试通过单击按钮在文本框中移动光标，则不需要按键事件。

标签： javascript

【解决方案1】：

handy blog post 为您提供了在文本区域中定位光标的完整信息。这是一个可能不适用于旧版浏览器的概念验证版本（有关兼容版本，请参阅链接）：

let cursorLocation = 0;

document.getElementById("myButton").addEventListener("click", e => {
  var input = document.getElementById('myInput');
  input.focus();
  input.setSelectionRange(++cursorLocation, cursorLocation);
});

<input id="myInput" type="text" value="sample text">
<button id="myButton">Click Me</button>

【讨论】：