我正在构建一些带有键盘快捷键的东西,例如,你按Ctrl+m来打开一个菜单。为此,我使用了jQuery和jwerty插件,代码如下所示:
jwerty.key('m', function () {
toggleMenu();
});
轻敲"m“键会触发toggleMenu功能。
现在我在想,当用户在输入栏或文本区中输入时,如何防止该函数被触发。
发布于 2013-05-23 02:55:42
我从未使用过jwerty,但我建议:
jwerty.key('m', function (e) {
if (e.target.tagName.toLowerCase() !== 'input') {
toggleMenu();
}
});
这将测试事件的目标,如果它不是input
,则调用toggleMenu()
函数;如果它是input
,则不执行任何操作(不过如果您愿意,也可以显式return false
)。
为了解释textarea
,正如我真的应该做的那样,上面的方法可以扩展(在if
评估中添加另一个子句,或者如下所示,可以采用switch
-based方法:
jwerty.key('m', function (e) {
switch (e.target.tagName.toLowerCase()) {
case 'input':
case 'textarea':
break;
default:
toggleMenu();
break;
}
});
如果目标元素是input
或textarea
,则按m
不执行任何操作,而如果这两个元素都不是,则进入默认状态并调用toggleMenu()
。
发布于 2013-05-23 02:56:02
一种方法是在您的输入和文本中添加另一个调用event.stopPropagation()
的事件处理程序(或者如果您使用jQuery,return false
)。这样,该事件处理程序将首先被触发,并且它将阻止该事件“传播”到您现有的处理程序。
另一种选择是检查现有处理程序中的事件,看看它是否来自输入/文本区域(如果您想采用这种方法,请参阅其他答案;如果您关心(实际上)旧浏览器的向后比较,您将希望使用大卫的答案,因为旧浏览器不支持activeElement:Which browsers support document.activeElement?)。
发布于 2013-05-23 03:11:11
您可以使用jQuery (和一些浏览器)提供的:focus
选择器和is
函数来测试项目是否具有焦点:
$(".my-thing").is(':focus')
https://stackoverflow.com/questions/16699516
复制相似问题