Kích hoạt sự kiện bàn phím trong Safari, sử dụng JavaScript

Tôi đang cố gắng mô phỏng một sự kiện bàn phím trong Safari bằng JavaScript.

Tôi đã thử điều này:

var event = document.createEvent("KeyboardEvent");
event.initKeyboardEvent("keypress", true, true, null, false, false, false, false, 115, 0);

... và cả cái này:

var event = document.createEvent("UIEvents");
event.initUIEvent("keypress", true, true, window, 1);
event.keyCode = 115;

Tuy nhiên, sau khi thử cả hai cách tiếp cận, tôi gặp cùng một vấn đề: sau khi mã được thực thi, các thuộc tính keyCode/ whichcủa đối tượng sự kiện được đặt thành 0, không phải 115.

Có ai biết cách tạo và gửi một sự kiện bàn phím trong Safari một cách đáng tin cậy không? (Tôi muốn đạt được nó bằng JavaScript đơn giản nếu có thể.)

Tôi đang làm việc về polyfill Sự kiện Bàn phím DOM Cấp 3 . Trong các trình duyệt mới nhất hoặc với polyfill này, bạn có thể làm như sau:

element.addEventListener("keydown", function(e){ console.log(e.key, e.char, e.keyCode) })

var e = new KeyboardEvent("keydown", {bubbles : true, cancelable : true, key : "Q", char : "Q", shiftKey : true});
element.dispatchEvent(e);

//If you need legacy property "keyCode"
// Note: In some browsers you can't overwrite "keyCode" property. (At least in Safari)
delete e.keyCode;
Object.defineProperty(e, "keyCode", {"value" : 666})

CẬP NHẬT:

Giờ đây, polyfill của tôi hỗ trợ các thuộc tính kế thừa "keyCode", "charCode" và "which"

var e = new KeyboardEvent("keydown", {
    bubbles : true,
    cancelable : true,
    char : "Q",
    key : "q",
    shiftKey : true,
    keyCode : 81
});

Ví dụ ở đây

Ngoài ra, đây là initKeyboardEvent trình duyệt chéo tách biệt với polyfill của tôi: (gist)

Polyfill bản demo

Bạn đã gửi sự kiện một cách chính xác?

function simulateKeyEvent(character) {
  var evt = document.createEvent("KeyboardEvent");
  (evt.initKeyEvent || evt.initKeyboardEvent)("keypress", true, true, window,
                    0, 0, 0, 0,
                    0, character.charCodeAt(0)) 
  var canceled = !body.dispatchEvent(evt);
  if(canceled) {
    // A handler called preventDefault
    alert("canceled");
  } else {
    // None of the handlers called preventDefault
    alert("not canceled");
  }
}

Nếu bạn sử dụng jQuery, bạn có thể làm:

function simulateKeyPress(character) {
  jQuery.event.trigger({ type : 'keypress', which : character.charCodeAt(0) });
}

Điều này là do một lỗi trong Webkit.

Bạn có thể khắc phục lỗi Webkit bằng cách sử dụng createEvent('Event')thay vì createEvent('KeyboardEvent')và sau đó chỉ định thuộc keyCodetính. Xem câu trả lời này và ví dụ này .

Các nhà phát triển Mozilla Mạng cung cấp lời giải thích sau đây:

1. Tạo sự kiện bằng event = document.createEvent("KeyboardEvent")
2. Init the keyevent

sử dụng:

event.initKeyEvent (type, bubbles, cancelable, viewArg, 
       ctrlKeyArg, altKeyArg, shiftKeyArg, metaKeyArg, 
           keyCodeArg, charCodeArg)

3. Cử sự kiện bằng cách sử dụngyourElement.dispatchEvent(event)

Tôi không thấy cái cuối cùng trong mã của bạn, có thể đó là cái bạn đang thiếu. Tôi hy vọng điều này cũng hoạt động trong IE ...

Tôi không giỏi lắm với cái này nhưng KeyboardEvent=> thấy KeyboardEvent được khởi tạo bằng initKeyEvent.
Đây là một ví dụ cho sự kiện phát ra trên <input type="text" />phần tử

document.getElementById("txbox").addEventListener("keypress", function(e) {
  alert("Event " + e.type + " emitted!\nKey / Char Code: " + e.keyCode + " / " + e.charCode);
}, false);

document.getElementById("btn").addEventListener("click", function(e) {
  var doc = document.getElementById("txbox");
  var kEvent = document.createEvent("KeyboardEvent");
  kEvent.initKeyEvent("keypress", true, true, null, false, false, false, false, 74, 74);
  doc.dispatchEvent(kEvent);
}, false);

<input id="txbox" type="text" value="" />
<input id="btn" type="button" value="CLICK TO EMIT KEYPRESS ON TEXTBOX" />