我正在使用 Mousetrap javascript 库,我想捕获特定元素的输入。
场景是我有一个用于用户名和密码的文本框,KnockoutJS 绑定(bind)到该文本框,然后在按下按钮时发出 ajax 请求以登录用户。现在因为没有表单而且它不是一个真正的按钮它是一个 Jquery UI 变成按钮的 anchor 我想知道是否有一些简单的方法可以让捕鼠器绑定(bind)到元素而不是在文档级别。
例如,一个普通的捕鼠器绑定(bind)是:
Mousetrap.bind('enter', function(event) { CallSomeAjaxMethod(); });
现在将检查页面上是否有任何输入键按下(在文本框元素之外),然后根据它执行某些操作。现在的问题是在这种情况下,我希望能够仅在特定元素的范围内执行时捕获此事件。
例如,我想做这样的事情:
var element = document.getElementById("some-element");
Mousetrap.bind('enter', element, function(event) { CallSomeAjaxMethod(); });
或者可能更流利:
Mousetrap.bind('enter', function(event) { CallSomeAjaxMethod(); }).on(element);
有什么办法吗?目前我能看到的唯一方法(使用 Mousetrap)是绑定(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);
最重要的是它应该向后兼容,这样您现有的所有代码仍然可以工作。
关于javascript - 在特定元素上使用捕鼠器?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16169645/