Как я могу сгенерировать событие нажатия клавиш в Safari с помощью Javascript?

Question

Как я могу программно генерировать события нажатия клавиш из кода Javascript, работающего в Safari? Похоже, что WebKit использует модель уровня 3 DOM для создания событий клавиатуры из Javascript, а модель событий клавиатуры уровня 3 DOM не поддерживает событие нажатия клавиш. Есть ли другой способ, которым я могу использовать?

Я ищу как можно более чистое решение для Safari / WebKit DOM. Я действительно предпочел бы не изменять веб-страницу, а также не добавлять зависимости от внешних библиотек. Мне нужно активировать любые существующие обработчики нажатий клавиш, чтобы не было возможности добавить новый обработчик и напрямую вызвать его.

Похоже, что WebKit имеет свойства keyCode и charCode события keypress, определенные в его классе UIEvent, но они доступны только для чтения. Есть ли способ установить эти свойства? Следующее не работает:

var evt = document.createEvent('UIEvents');
evt.initUIEvent('keypress', true, true, window, 0);
evt.keyCode = 114; // 'r'
evt.charCode = 114;
alert("keyCode = " + evt.keyCode + ", charCode = " + evt.charCode); // both 0

Установка свойства detail в вызове initUIEvent также, похоже, не имеет никакого эффекта.

Answer 1

Используйте TextEvent (представленный DOM3). Поскольку вы хотите генерировать события нажатия клавиш, я предполагаю, что вы работаете с символами. В приведенном ниже коде textToInsert - это строка, а textarea - элемент, которому отправляется событие.

var eventObject = document.createEvent('TextEvent');
eventObject.initTextEvent('textInput',
                          true,
                          true,
                          null,
                          textToInsert);

textarea.dispatchEvent(eventObject);

Это работает в Safari 3.1.2 (следовательно, в Chrome).

Answer 2

У меня была такая же проблема. Я хотел написать тест, в котором при нажатии клавиши ввода в графическом интерфейсе позиция (li) добавляется в список. Для этого мне нужно было «сгенерировать» нажатие клавиш. Попытавшись сгенерировать событие, смоделировать событие, смоделировать событие (jqMock), вот очень простое решение.

Я могу продолжить с BDDing моего кода, используя код jsSpec и jQuery. Этот тест будет немного сложнее, если вы используете плагин для управления нажатиями клавиш (например, плагин hotkeys jQuery)

Вот что я хочу сделать:

<code>describe 'I need to be able to edit items in a list', {</p>

<p>... [setup code and other tests]</p>

<p>'should create a new item if I press enter': function(){
    value_of($('#todo').items().size()).should_be(7)
    // be on the last item in the list
    task = $('#todo').items().filter(':last').focus()
    // press enter
    task.__keypress(13)
    // check that an item was added 
    value_of($('#todo').tasks().size()).should_be(8)
    },
}

Вот код, который связывает обработчик. Обратите внимание, что в этом решении я перехватываю событие и прохожу только через код which - это позволяет мне передать значение из теста. Это все, что мне нужно на данный момент. Очевидно, что если бы я хотел перехватить больше, мне нужно было бы расширить то, что передается (например, см. Плагин jquery.hotkeys):

$().items().bind('keypress', function(event){$().__keypress(event.which)})

А вот обработчик:

  __keypress: function(which){
      switch(which)
      {
        ...

        case 13:  // enter
          [my code that creates a new item]        
          break;
        default:
      }       
  },

ps: если кто-то умеет издеваться над window.event, дайте мне знать. Мне не повезло с использованием jqMock.

Answer 3

Похоже, очень похожий (не специфичный для браузера) вопрос был задан и уже получен ответ:

Нажать клавишу JQuery ... и указать, какая клавиша была нажата

Answer 4

http://docs.jquery.com/Events/keypress#fn

Другими словами, вы присоединяете событие нажатия клавиши к некоторому элементу. Используя элемент с идентификатором "someid", например:

<script language="text/javascript" src="jquery.js"></script>
<script language="text/javascript">
$(function() {
    // add a keypress handler
    $("#someid").keypress(function(e){
        alert('you just pressed ' + e.which);
    });
    // imitate the keypress
    $("#someid").keypress();
});
</script>