如何从div标签中捕获页面上的任何按键事件？

Question

有人能告诉我如何在div标签中捕获键盘事件吗？

我写了这段代码，但它不起作用？

<div id="SDiv" style="background-color: White; " onkeypress="kypress()">
     <asp:Label ID="LblSaveAndMoveNext" runat="server" Visible="False" Text="Save"></asp:Label>
</div>

<script type="text/javascript"> 
    function kypress() { EnableButtons(true);}
</script>

- Lakki

---

div标签不是能够设置焦点的标签。 - Behnam Esmaili

你必须先将焦点设置到div上。请查看此链接以获取更多信息。 - Behnam Esmaili

那么如何实现呢？我的页面中没有表单标签。我的要求是当我在页面中按下任意键时，应调用keypress()函数。 - Lakki

Answer 1

为了触发按键事件，您必须有一个焦点。

或者您可以将按键事件应用于文档对象。

使用jQuery：

$(document).keypress(function(){
     /*do something*/
});

- Jonathan de M.

Answer 2

只有可以接收焦点的元素，例如输入框和其他表单相关元素，才会触发键盘事件。如果要强制使一个 <div> 元素能够接收焦点，您可以将其设置为可编辑内容，但这可能不是您想要的，或者添加一个 tabindex 属性。使用值 0 将把该元素放置在选项卡顺序中的默认位置。

<div id="SDiv" tabindex="0" style="background-color: White;"
     onkeypress="kypress()">
    ...
</div>

- Tim Down

Answer 3

您可以通过使用contenteditable div来克服它，就像这样。 确保返回false以防止对html进行更改。

    <div  id="SDiv" contenteditable="true" 
    style="background-color: White; " tab-index="1" onkeydown="return keydown();">
       <asp:Label ID="LblSaveAndMoveNext" runat="server" Visible="False" Text="Save"></asp:Label>           
    </div>


    <script type="text/javascript">
        function keydown(){
            var keyCode = event.which;
            if(keyCode==13)
                document.write('You pressed Enter');
            //do your logic here
            return false;
        }
    </script>

- Akhil Sekharan

Answer 4

请参考线程 "jQuery Event Keypress: Which key was pressed?" 获取答案...

您需要将div的tabindex属性设置如下：

<div id="example" tabindex="1" />

- shintoZ