Question

如何以编程方式从Safari中运行的Javascript代码生成按键事件？看起来WebKit使用DOM 3级模型从Javascript创建键盘事件，而DOM 3级键盘事件模型不支持keypress事件。还有其他方法可以使用吗？

我正在寻找尽可能纯粹的Safari / WebKit DOM解决方案。我真的不想修改网页，我也不想在外部库上添加依赖项。我需要激活任何现有的按键处理程序，因此无法添加新的处理程序并直接调用它。

看起来WebKit具有在其UIEvent类中定义的keypress事件的keyCode和charCode属性，但它们是只读的。有没有办法设置这些属性？以下不起作用：

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

在对initUIEvent的调用中设置detail属性似乎也没有效果。

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

听起来像是一个非常相似（非浏览器特定）的问题已被问及并已回答：

Trigger a keypress with jQuery...and specify which key was pressed

Answer 3

我遇到了同样的问题。我希望能够编写一个测试，当在GUI上按下回车键时，行项目（li）被添加到列表中。那时，我需要“生成”一个按键。尝试生成事件，模拟事件，模拟事件（jqMock），这是一个非常简单的解决方案。

我可以使用jsSpec和jQuery代码继续BDDing我的代码。如果您使用插件来管理按键（例如热键jQuery插件），那么此测试会更难一点

这就是我想要做的事情：

describe 'I need to be able to edit items in a list', {

... [setup code and other tests]

'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 4

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

换句话说，您将一个按键事件附加到某个元素。使用ID为“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>

如何使用Javascript在Safari中生成按键事件？

4 个答案: