Question

我在div标签内显示一个表单作为对话框输入详细信息。在这种形式中，我想使用jquery处理esc键。如果任何输入标签具有焦点，则会触发keydown事件。如果焦点在表单上但不在任何输入标签上，则它不会触发keydown事件。

这是我的代码。

`

$("#NewTicket").keydown(function(e)

{

    var unicode=e.keyCode? e.keyCode : e.charCode

    if(unicode == 27)

    {

            if (confirm("Are you sure you want to cancel?")) 

                    return true

            else

                    return false

    }

}）;`

Answer 1

只需在表单中添加id，类

即可

<form id="form">
....

现在这样做：

$("#NewTicket,#form").keydown(function(e)

{

    var unicode=e.keyCode? e.keyCode : e.charCode

    if(unicode == 27)

    {

            if (confirm("Are you sure you want to cancel?")) 

                    return true

            else

                    return false

    }
)};

这应该有效

Answer 2

您无法专注于表单。如果您不想处理无法获得焦点的元素（例如div或表单）的keydown，则必须将其绑定到文档。

原来jQuery会自动添加：焦点选择器，使您可以使用$(':focus')

找到焦点元素

Answer 3

我相信如果你把你的表单放在一个可以使用tabIndex聚焦的元素中，或者这个可聚焦的div是表单中的容器元素，那么你可以将keyDown绑定到这个div。就我测试而言，它可以跨浏览器工作，但我没有看到这个解决方案讨论得太多，所以对任何人的评论都很好奇。

Answer 4

我知道这是一个古老的问题，但是仍然有人会在寻找答案。

通常，我确实在全局级别上捕获了键，然后将其转发给函数并在那里进行处理。根据您的需要，您可以获取nodeName。（已在FF，Chrome中测试）

$(document).keydown((e)=>{//Capture Key
    if(["INPUT","TEXTAREA"].indexOf(e.target.nodeName)!==-1){//If input in focus
      console.log("INPUT FOCUSED",e.code,e.keyCode);
      if(e.keyCode==27 || e.code=="Escape"){//Capture Escape key        
        console.log('ESC');
      }
    }
});

html中表单或div的keydown事件

4 个答案: