Используя .keydown () чтобы вернуть div id?

Question

Я не совсем уверен, правильно ли я формулирую это, но я пытаюсь сделать так, чтобы функция возвращала идентификатор div для события keydown.

Скажем, мой HTML-код:

<div class="pad" id="snare" data-key="97"></div>
<div class="pad" id="kick" data-key="98"></div>

По сути, я хочу, чтобы мой JS делал что-то вроде этого:

function handlekeydown(e) {
    console.log("data-key: " + e.keyCode);
    if (e.keycode == $(".pad").data("key")) {
        return this.id
    }
}

Я мог бы написать switch оператор с каждым keycode, возвращающим переменнуюс тем же именем, что и идентификатор, но это лишило бы смысла иметь его в моем HTML.

Как мне написать функцию для поиска div для data-key, который бы соответствовал keycode а затем вернуть его идентификатор?

Answer 1

A событие нажатия клавиши - это событие клавиатуры.

Событие нажатия клавиши запускается только на текущем activeElement документа.

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

ps: я обновлю этот же ответ.

Answer 2

По вопросу

How would I write a function to search a div for a data-key that would match the keycode?

Вы можете сделать это:метод из обработчика событий, который использует id.

function processId(id) {
    console.log(id);
}

function handlekeydown(e) {
    var element = $('[data-key="' + e.keyCode + '"]');
    if (element.length) {
        processId(element[0].id);
    }
}