Можно ли программно моделировать события нажатия клавиш? - PullRequest
Новая
       81

Можно ли программно моделировать события нажатия клавиш?

314 голосов
/ 27 февраля 2009

Можно ли программно моделировать события нажатия клавиш в JavaScript?

Ответы [ 18 ]

7 голосов
/ 04 декабря 2015

просто используйте CustomEvent 

Node.prototype.fire=function(type,options){
     var event=new CustomEvent(type);
     for(var p in options){
         event[p]=options[p];
     }
     this.dispatchEvent(event);
}

4 ex хочет имитировать Ctrl + Z 

window.addEventListener("keyup",function(ev){
     if(ev.ctrlKey && ev.keyCode === 90) console.log(ev); // or do smth
     })

 document.fire("keyup",{ctrlKey:true,keyCode:90,bubbles:true})
4 голосов
/ 11 сентября 2014

Вот библиотека, которая действительно помогает: https://cdn.rawgit.com/ccampbell/mousetrap/2e5c2a8adbe80a89050aaf4e02c45f02f1cc12d4/tests/libs/key-event.js

Я не знаю, откуда это взялось, но это полезно. Он добавляет .simulate() метод к window.KeyEvent, поэтому вы просто используете его с KeyEvent.simulate(0, 13) для имитации enter или KeyEvent.simulate(81, 81) для 'Q'.

Я получил это в https://github.com/ccampbell/mousetrap/tree/master/tests.

4 голосов
/ 13 марта 2017

Это сработало для меня и имитирует keyup для моей textaera. если вы хотите, чтобы это было для всей страницы, просто поставьте KeySimulation() на <body>, как это <body onmousemove="KeySimulation()"> или, если нет, onmousemove, то onmouseover или onload тоже будет работать. 

<script>
function KeySimulation()
{
var e = document.createEvent("KeyboardEvent");
if (e.initKeyboardEvent) {  // Chrome, IE
    e.initKeyboardEvent("keyup", true, true, document.defaultView, "Enter", 0, "", false, "");
} else { // FireFox
    e.initKeyEvent("keyup", true, true, document.defaultView, false, false, false, false, 13, 0);
}
document.getElementById("MyTextArea").dispatchEvent(e);
}
</script>

<input type="button" onclick="KeySimulation();" value=" Key Simulation " />
<textarea id="MyTextArea" rows="15" cols="30"></textarea>
3 голосов
/ 25 сентября 2018

Вот что мне удалось найти: 

function createKeyboardEvent(name, key, altKey, ctrlKey, shiftKey, metaKey, bubbles) {
  var e = new Event(name)
  e.key = key
  e.keyCode = e.key.charCodeAt(0)
  e.which = e.keyCode
  e.altKey = altKey
  e.ctrlKey = ctrlKey
  e.shiftKey = shiftKey
  e.metaKey =  metaKey
  e.bubbles = bubbles
  return e
}

var name = 'keydown'
var key = 'a'

var event = createKeyboardEvent(name, key, false, false, false, false, true)

document.addEventListener(name, () => {})
document.dispatchEvent(event)
3 голосов
/ 21 мая 2018

Однорядный ванильный веб-инспектор Javascript, готовый для консоли в copy + paste (этот парень уже привлекателен для большинства разработчиков, поэтому не пытайтесь чтобы оправдать его - он должен быть одиноким .. гребным) 

    var pressthiskey = "q"/* <--- :) !? q for example */;
    var e = new Event("keydown");
    e.key = pressthiskey;
    e.keyCode = e.key.charCodeAt(0);
    e.which = e.keyCode;
    e.altKey = false;
    e.ctrlKey = true;
    e.shiftKey = false;
    e.metaKey = false;
    e.bubbles = true;
    document.dispatchEvent(e);
3 голосов
/ 31 марта 2018

Вот решение, которое работает в Chrome и Chromium (тестировали только эти платформы). Похоже, в Chrome есть какая-то ошибка или собственный подход к обработке кодов клавиш, поэтому это свойство нужно добавить отдельно в KeyboardEvent. 

function simulateKeydown (keycode,isCtrl,isAlt,isShift){
    var e = new KeyboardEvent( "keydown", { bubbles:true, cancelable:true, char:String.fromCharCode(keycode), key:String.fromCharCode(keycode), shiftKey:isShift, ctrlKey:isCtrl, altKey:isAlt } );
    Object.defineProperty(e, 'keyCode', {get : function() { return this.keyCodeVal; } });     
    e.keyCodeVal = keycode;
    document.dispatchEvent(e);
}
0 голосов
/ 11 марта 2019

Я знаю, что вопрос требует javascript-способа имитации нажатия клавиш. Но для тех, кто ищет способ сделать jQuery: 

var e = jQuery.Event("keypress");
e.which = 13 //or e.keyCode = 13 that simulates an <ENTER>
$("#element_id").trigger(e);
0 голосов
/ 25 марта 2018

как только пользователь нажмет соответствующую клавишу, вы можете сохранить ссылку на этот элемент и использовать ее в любом другом HTML-элементе: 

EnterKeyPressToEmulate<input class="lineEditInput" id="addr333_1" type="text" style="width:60%;right:0%;float:right" onkeydown="keyPressRecorder(event)"></input>
TypeHereToEmulateKeyPress<input class="lineEditInput" id="addr333_2" type="text" style="width:60%;right:0%;float:right" onkeydown="triggerKeyPressOnNextSiblingFromWithinKeyPress(event)">
Itappears Here Too<input class="lineEditInput" id="addr333_3" type="text" style="width:60%;right:0%;float:right;" onkeydown="keyPressHandler(event)">
<script>
var gZeroEvent;
function keyPressRecorder(e)
{
  gZeroEvent = e;
}
function triggerKeyPressOnNextSiblingFromWithinKeyPress(TTT)
{
  if(typeof(gZeroEvent) != 'undefined')  {
TTT.currentTarget.nextElementSibling.dispatchEvent(gZeroEvent);
keyPressHandler(TTT);
  }
}
function keyPressHandler(TTT)
{
  if(typeof(gZeroEvent) != 'undefined')  {
TTT.currentTarget.value+= gZeroEvent.key;
event.preventDefault();
event.stopPropagation();
  }
}
</script>

вы можете установить keyCode, если вы создаете свое собственное событие, вы можете скопировать существующие параметры из любого реального события клавиатуры (игнорируя цели, так как это задание dispatchEvent) и: 

ta = new KeyboardEvent('keypress',{ctrlKey:true,key:'Escape'})
Страница:
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...