javascript - 如何在浏览器窗口中使用 vanilla JavaScript 模拟键盘按下?

标签 javascript html dom ecmascript-6

我知道之前有人问过与此类似的问题,但我能找到的所有答案要么在 jQuery 中,要么似乎不再有效。我试过做不同的

function send(char, elem) {
   let e = new KeyboardEvent('keydown', {key: char});
   elem.dispatchEvent(e);
}

但运气不好。它分派(dispatch)并触发适当处理程序的事件,但如果输入/文本区域元素获得焦点,则不会键入键。

最佳答案

您不能通过代码触发的事件进行键入 - 但是,您可以设置一个监听器并创建一个自定义事件,以免将触发事件与常规按键混淆。

$("#button").on("click", function() {
  $("#input").trigger({
    type: "myKeypress",
    which: "A".charCodeAt(0)
  });
});

$("#input").on("myKeypress", function(e) {
  $(this).val($(this).val() + String.fromCharCode(e.which));
});
<script src="https://code.jquery.com/jquery-3.3.1.js"></script>
<input type="text" id="input">
<button id="button">Type A</button>

您也可以使用所有键来实现这一点:

$("#button").on("click", function() {
  $("#input").trigger({
    type: "myKeypress",
    which: prompt("Enter a letter").charCodeAt(0)
  });
});

$("#input").on("myKeypress", function(e) {
  $(this).val($(this).val() + String.fromCharCode(e.which));
});
<script src="https://code.jquery.com/jquery-3.3.1.js"></script>
<input type="text" id="input">
<button id="button">Type a letter</button>

关于javascript - 如何在浏览器窗口中使用 vanilla JavaScript 模拟键盘按下?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56608165/

相关文章:

html - 输入提交在谷歌浏览器中不起作用

javascript - 意外的 css 位置 :absolute behavior

javascript - 使用 JS 跟踪和更新元素

javascript - 找出 <td> 元素内 <span> 元素的数量

javascript - 在javascript中将unicode转换为货币符号

javascript - 由于标题固定,jQuery 滚动偏移

javascript - 在 mousedown 和 mousemove 事件中获取鼠标位置

javascript - javascript 中的 highcharts 系列更新

javascript - 使用清晰的 HTML5/JS 播放彩信流

javascript - 如何避免在使用 DOM 添加和删除 html 表格行时删除第一行?