Question

我有以下示例代码，当div处于焦点并按下某个键时，它会弹出一个警告。这符合我在IE 7中所期望的，但在Firefox 3.5.5中却没有。我做错了什么？

<html>
<head>
    <title>JS test</title>
    <script type="text/javascript" src="jquery-1.3.2.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            $("#testdiv").keydown(function(event) {
                alert("Pressed " + event.keyCode);
            });
        });
    </script>    
    <style type="text/css">
        #testdiv
        {
            width: 50;
            height: 50;
            background-color: red;
        }
    </style>
</head>
<body>
    <div id="testdiv"></div>
</body>
</html>

编辑：我刚刚尝试用keydown和keypress替换keyup，但这些也无效。顺便提一下，我还确保我的“按键同时查找”设置是关闭的，以防万一。

Answer 1

你需要给div一个tabindex，以便它可以获得焦点。

<div id="testdiv" tabindex="0"></div>

Answer 2

我已经在Firefox中使用了上述功能，如下所示：

$('#domainTableDiv').keydown(function(e) {
        alert(e.type + " button(" + e.which + ") ctrl(" + e.metaKey + ") alt(" + e.altKey + ") shift(" + e.shiftKey + ")" );
    });

$('#domainTableDiv').focus();

一旦DIV明确关注它，关键事件就会在Firefox 4.0.1中正常启动

Answer 3

我不认为这会起作用，因为div不应该接收类似的关键事件。如果您放置了＆lt; input＆gt;在div的内部，用户按下了输入本身的一个键，事件将冒泡到div并运行你的功能。我不是100％肯定你的项目正在做什么，所以我不知道如何给你更多的建议，但即使我不应该，我有点惊讶IE正在开启一个keydown事件一个div。

Answer 4

我们也可以使用这样的东西：

$('#tbl tbody').attr("tabindex", 1).focus();
$('#tbl tbody').keydown(function (event) {
    ...
});

Answer 5

您可以从这里在线查看

源代码

<html>
<head>
    <title>JS test</title>
    <script type="text/javascript">
        $(document).ready(function() {
            $("#testdiv").keydown(function(event) {
                alert("Pressed " + event.keyCode);
            });
        });
    </script>    
    <style type="text/css">
        #testdiv
        {
            width: 50px;
            height: 50px;
            background-color: red;
        }
    </style>
</head>
<body>
    <div id="testdiv" tabindex="0"></div>
</body>
</html>

Answer 6

我无法使用jquery中的最新CDN在Firefox 5中使用这些答案。我需要知道div中的一个孩子是否有关键事件所以我采取了这个：

$(document).keypress(function(e){
    if(!$(e.target).parents().is("#testdiv")) return;
    /* do child-of-div specific code here */
}

如果目标是当前的div（它有焦点），我想你可以这样做：

$(document).keypress(function(e){
    if(!$(e.target).is("#testdiv")) return;
    /* do div specific code here */
}

Answer 7

这是因为jQuery版本。尝试http://code.jquery.com/jquery-latest.js作为来源

jQuery - div上的keydown（）无法在Firefox中运行

7 个答案:

您可以从这里在线查看

源代码