Событие KeyDown при перетаскивании JQuery не срабатывает

Question

Я динамически добавляю перетаскиваемые элементы, и я могу удалить их через зону сброса.Теперь я хочу добавить возможность удалять их нажатием клавиши.Я пытался с этим кодом:

$('.draggable').keydown(function(e){
    if(e.keyCode == 46) {
        $(this).remove();
    }
});

Есть идеи, почему это не работает?

Answer 1

Мне кажется, я вижу проблему.@Ctrl_Alt_Defeat находится на правильном пути, но событие для keydown для класса .draggable не имеет смысла.Так как это для перетаскиваемого jQueryUI, эти события будут срабатывать только в том случае, если .draggable является текущим фокусированным классом.Что, вероятно, не произойдет, когда вы этого захотите.

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

$('document').on('keydown', function(e) {
   alert("Method Hit");
   if(e.keyCode == 46) {
        console.log("Remove the draggable class now");
        $(".draggable").remove();
    }
});

Конечноэтот подход будет применять событие ко всему документу, поэтому, если вы нажмете delete, любой элемент с классом draggable будет удален.Если это хорошо с вами, то это будет работать.Если вы хотите выполнить целевое удаление, вы можете применить щелчок мышью, чтобы добавить класс, а затем удалить ключ с последнего нажатия .draggable.

Answer 2

вы можете попробовать передать свой ввод с классом поиска в качестве аргумента методу .on (), как показано ниже:

$('document').on('keydown', '.draggable', function(e) {
       alert("Method Hit");
       if(e.keyCode == 46) {
            console.log($this);
            $(this).remove();
        }
    });