Jquery 如何识别钥匙是否在悬停状态下？

仅当另一个

div

悬停且空格键向下时，我才想显示一个

div

。我尝试使用

keyCode

和

这两个属性，它们都是事件的属性，但都不起作用。不过，我可以为按下CTRL键而不是空格键创建一个示例，如您所见

我应该如何更改代码，使其在空格键（或任何其他键）按下时工作

HTML:

JS:

在悬停时，我会设置一个标志，然后在离开悬停状态时，我会重置标志。当按下空格键时，您可以检查是否处于悬停状态

我不确定悬停和空间是否能以你想要的方式被捕获

编辑

在jquery中，您可以将event.which和event.hover组合在同一个元素上，也许您可以将它们链接起来

我会快速看一看，但我不喜欢你的机会

编辑2

问题是div不会获得任何关键事件。我认为您需要在文档中附加一个键侦听器，并将鼠标悬停在div上并保留一个标志

您可以像这样链接事件
$（“#myElement”）.bind（'hover keydown'，function（）{}）
您可以利用绑定两个处理程序的事实。一个用于mouseenter，一个用于mouseleave

在mouseenter上绑定一个，然后在mouseleave上简单地绑定一个：

$(function() {

      // Define the mouseenter and mouseleave handlers with hover
    $("div.a").hover(function() {

          // Show other div if a key is pressed.
          // You can of course check for on particular key.
        $(document).keydown(function() {
            $("div.b").show();
        });

    }, function() {

         // unbind the keydown handler on mouseleave
       $(document).unbind("keydown");

       $("div.b").hide();
    });
});​




一个重要的注意事项是，即使窗口没有聚焦，也会工作，但是只有在窗口聚焦时才会工作。
但是为什么它可以使用CTRL键而不能使用其他键呢？我相信这是因为CTRL键不是可显示的chr，因此被元素捕获并冒泡。div已经没有办法处理一个可显示的chr，所以不必麻烦它。很好的解决方案！非常感谢！
body {
    position: relative;
}
div {
    width: 100px;
    height: 100px;
    position: absolute;
}
.a {
    background: #777;
    left: 50px;
    top: 30px;
}
.b {
    display: none;
    background: #000;
    left: 250px;
    top: 100px;
}

$(function() {
    $('div').hover(function(e) {
        if (e.ctrlKey) {
            $('.b').show();
        }
    }, function() {
        if ($('.b').is(':visible')) $('.b').hide();
    });
});

$(function() {

      // Define the mouseenter and mouseleave handlers with hover
    $("div.a").hover(function() {

          // Show other div if a key is pressed.
          // You can of course check for on particular key.
        $(document).keydown(function() {
            $("div.b").show();
        });

    }, function() {

         // unbind the keydown handler on mouseleave
       $(document).unbind("keydown");

       $("div.b").hide();
    });
});​