События после динамического добавления контента. Есть ли решение на native JS?

Question

[Виталий]

Доброго времени суток. Есть форма, которая обновляется через ajax. В ней есть input, на который можно повесить событие.
На JQuery можно написать так

$(document).on('focus', 'input', function(){
// some action
});

Подскажите, как написать это же на чистом JS , ES5 в частности.

Answer 1

[0xD34F]

То, что вам нужно, называется делегирование.

Надо только иметь в виду, что focus не всплывает, поэтому обрабатывать его следует на стадии захвата:

document.addEventListener('focus', function(e) {
  if (e.target.tagName === 'INPUT') {
    // здесь ваш код
  }
}, true);

Или, вместо focus использовать focusin, который всплывает.

Answer 2

[Alex]

https://learn.javascript.ru/introduction-browser-events

Answer 3

[Артур]

https://developer.mozilla.org/en-US/docs/Web/API/E...

Answer 4

[Moses Fender]

document.addEventListener('focus', function(ev){
  if(ev.target instanceof HTMLInputElement){
     …
  }
});