Как определить, нажата ли клавиша Enter в DIV, используя jquery?

Я успешно подключил событие EnterKey на уровне документа следующим образом:

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

Но я не могу связать событие EnterKey с Div с id "myDiv".

<div id="myDiv"></div>

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

Можно ли обнаружить нажатие EnterKey в Div? Фактически, Div содержит некоторые элементы ввода/выбора, которые используются для фильтрации содержимого сетки. Я хочу связать событие EnterKey, чтобы при нажатии EnterKey я могу фильтровать Grid.

EDIT: Обратите внимание, что у меня есть входные данные в div (я намеренно их не показывал). Я не хочу подключать событие вручную для каждого входного элемента управления в Div. Кроме того, я предполагаю, что когда пользователь нажимает EnterKey, по крайней мере один элемент управления вводом должен иметь фокус.

Ответ 1

Попробуйте это

 <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!');
    }
 });
});

Демо

Ответ 2

Единственный способ, которым элемент DOM может принимать ключевые события, - это если он имеет фокус.

Либо установите фокус на div в обработчике onready:

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

Или выделите свой элемент через атрибут tabindex.

РЕДАКТИРОВАТЬ: Как объяснил @roasted, вы также можете установить правило CSS для своего div, чтобы избежать проблем с рестайлингом:

#myDiv {
  outline: 0 solid;
}

Ответ 3

Что вам действительно нужно сделать, это привязать событие keypress ко всем элементам формы, таким как ввод, выбор и текстовое поле внутри div, например:

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

Главное, чтобы заметить здесь использование event.preventDefault(). Поскольку, если вы не используете его, нажатие клавиши ввода может привести к отправке формы, которую вы явно не хотите здесь. Вы просто хотите нажать клавишу ввода, чтобы фильтровать содержимое сетки. Итак, как только нажата клавиша ввода, вы можете получить значения из входных элементов и соответствующим образом фильтровать сетку.

Ответ 4

Ваш вопрос может быть более точным - вы хотите обнаружить событие KeyPressed на входном объекте, вложенном в определенный div. Возможно, вы могли бы попробовать:

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

Ответ 5

Вы можете сначала сфокусировать кнопку отправки или тег, а затем щелкнуть по ней.

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

или

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

затем нажмите enter

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

Ответ 6

Кнопка ввода нажата в основном для ввода чего-либо или отправки. У вас есть кнопка или текстовое поле внутри выделенного раздела, а затем нажмите клавишу ввода.

Ответ 7

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

вы хотите обработать обработчик события определенной кнопкой ввода (например, кнопкой "фильтр" )

Ответ 8

Вы можете сначала установить фокус на div, используя:

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

Затем используйте свой код, который он будет работать.