如何使用jquery检测是否在DIV中按下了Enter键

我已经成功地在文档级别钩住了EnterKey事件，如下所示：

    $(document).keypress(function (e) {
        if (e.which == 13) {
            alert('You pressed enter!');
        }
    });

但是，我无法在id为"myDiv"的Div上勾选EnterKey事件。

<div id="myDiv"></div>
$("#myDiv").keypress(function (e) {
     if (e.which == 13) {
         alert('You pressed enter!');
     } 
 });

是否可以在Div中检测到按下EnterKey？实际上，Div包含一些用于过滤网格内容的输入/选择控件。我想勾选EnterKey事件，这样当按下EnterKey时，我可以过滤网格。

编辑：请注意，我在div中有输入(我有意不在这里显示它们(。我不想手动为Div中的每个输入控件挂起事件。此外，我假设当用户按下EnterKey时，至少有一个输入控件将具有焦点。

试试这个

 <div id="Div1">
    <input type ="text" id="aa"/>
    sdfsd hsjdhsj shdj shd sj
 </div>

Jquery

$(function(){
 $("#Div1 input").keypress(function (e) {
    if (e.keyCode == 13) {
        alert('You pressed enter!');
    }
 });
});

演示

DOM元素接收关键事件的唯一方法是，如果他拥有焦点。

在onready处理程序中将焦点设置为div：

$(function() {
   $('#mydiv').focus();
});

或者通过tabindex属性将焦点赋予元素。

编辑：正如@baked所解释的，您还可以为div设置CSS规则以避免重新设计问题：

#myDiv {
  outline: 0 solid;
}

这里真正需要做的是将按键事件绑定到div内的所有表单元素，如输入、选择和文本区域，如：

$("#myDiv input, select, textarea").keypress(function (event) {
    if (event.which == 13) {
        event.preventDefault();
        alert('You pressed enter!');
    }
});

这里需要注意的主要内容是event.preventDefault()的使用。因为，如果你不使用它，按回车键可能会导致提交表单，而这显然是你不想要的。您只需要按下回车键来过滤网格的内容。因此，只要按下回车键，就可以从输入元素中获取值，并相应地过滤网格。

您可以先关注提交按钮或标签，然后单击

  $('#id of input button').focus();

或

 $('input[type="submit"]').focus();

然后按enter

 $("#inputid").keypress(function (e) {
   if (e.which == 13) {
    alert('You pressed enter!');
  }
});

您的问题可能更准确-您想在嵌套在某个div中的输入对象上检测KeyPressed事件。也许您可以尝试：

$("#myDiv input,select").keypress(function (e) {
        if (e.which == 13) {
            alert('You pressed enter!');
        }
    });

Enter键主要用于输入内容或提交。在突出显示的div中有一个按钮或文本框，然后按enter键。

$("#inputid").keypress(function (e) {
    if (e.which == 13) {
        alert('You pressed enter!');
    }
});

您希望将事件处理程序绑定到特定的输入/按钮(如某些"过滤器"按钮(

您可以首先使用在div上设置焦点

window.location.hash = '#name of div';

然后使用您的代码，它就会工作。

相关内容

最新更新

热门标签：