Как делегировать обработку события не с селектором, а с Jquery объектом?

250

11 мая 2018, 08:16

Нужно обработать событие для динамически добавленного объекта.
Обработка обычно делается так:

$parent.on(events, [selector], [data], handler)

Где:

$parent — это статический родительский элемент
selector — это селектор для выбора нужного дочернего элемента

Допустим, нужный дочерний элемент, событие на котором нужно обработать, уже хранится в переменной $child:

$parent.on(events, $child, [data], handler)

Так не работает. Как делегировать обработку в таком случае?

Answer 1

$parent.on("event_name", function(event) {
  if (event.target == $child[0]) {
    // ... do something
  }
});

Answer 2

По идее, стоит не делегировать событие а назначить его прямо на враппер, и на нем уже определять от кого из дочерних элементов оно пришло. Если пришло от дочки, которая имеет нужный класс (ведь дочек много может быть разных), то это то, что нужно.

var $wrapper = $("#wrapper");
    $inners = $(".inner") || ""
$wrapper.click(function(e){
  if ( $(e.target).hasClass("inner") ){
    alert("Inner click");
  }
})

Вот работающая модель, может пригодится ) https://codepen.io/Valiev/pen/gzvZVJ