javascript - 在特定元素上使用捕鼠器？

我正在使用Mousetrap javascript库，并希望捕获特定元素上的输入。

场景是我有一个用户名和密码的文本框，KnockoutJS绑定(bind)到该文本框，然后当按下按钮时，会发出ajax请求来登录用户。现在，由于没有表单且它不是一个真正的按钮，因此它是Jquery UI变成按钮的 anchor ，我想知道是否有某种简单的方法来使捕鼠器绑定(bind)到元素而不是在文档级别。

因此，例如，正常的捕鼠器绑定(bind)将是:

Mousetrap.bind('enter', function(event) { CallSomeAjaxMethod(); });

现在，该操作将检查页面上(文本框元素外部)是否有任何Enter键，然后根据此内容执行某些操作。现在的问题是，在这种情况下，我希望只能在特定元素的范围内执行此事件时捕获该事件。

因此，例如，我想做这样的事情:

var element = document.getElementById("some-element");
Mousetrap.bind('enter', element, function(event) { CallSomeAjaxMethod(); });

或更流利的像:

Mousetrap.bind('enter', function(event) { CallSomeAjaxMethod(); }).on(element);

有什么办法吗？我目前看到的唯一方法(使用捕鼠器)是绑定(bind)此文档作用域，并尽可能尝试获取引发事件的元素。

我知道您可以使用Jquery或vanilla js进行此类操作，但是由于我已经加载了捕鼠器，因此，如果可能的话，我想在这里重新使用它。

最佳答案

我想跟进此事。从1.5.0版(今天发布)开始，现在可以在Mousetrap中本地实现。

对于上面的特定示例，您要做的就是

var element = document.getElementById("some-element");
Mousetrap(element).bind('enter', function(event) { CallSomeAjaxMethod(); });

您也可以创建一个新的捕鼠器实例来绑定(bind)多个对象。

var mousetrap = new Mousetrap(element);
mousetrap.bind('space', _handleSpace);
mousetrap.bind('enter', _handleEnter);

最重要的是，它应该向后兼容，因此所有现有代码仍然可以使用。