Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   обработчик событий для динамически добавленных элементов (https://javascript.ru/forum/events/52288-obrabotchik-sobytijj-dlya-dinamicheski-dobavlennykh-ehlementov.html)

alecto 25.06.2018 12:19

var items = document.querySelector('.page-content');

я вешаю обработчик на родителя, затем ловлю на каком элементе происходит событие.
когда событие наступает - нужно снять обработчик.
а он не снимается.
подозреваю, что проблема в передаче функции через handler в addEventLiustener.

рони 25.06.2018 12:53

Dilettante_Pro,
строка 1 и строка 5 ???

alecto 25.06.2018 12:55

Dilettante_Pro,

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

пример выше у меня не работает ни на сайте, ни после перетягивания в редактор :(
стурктура элементов в вашем примере была правильная
page-content - родитель
item-actions__cart - вложенные элементы

Dilettante_Pro 25.06.2018 12:56

рони, спасибо, я уже заметил.
Не снимается.
<div class = 'page-content'>page-content
   <div >Content</div>
   <div class = 'item-actions__cart'>Content Cart</div>
   <div >Content</div>
</div>
<script>
var fnCounter = function (e) {
  var target = e.target;
  alert(target.textContent);
  if (target.classList.contains('item-actions__cart')) {
    items.removeEventListener('click', fnCounter);
  }
};


var items = document.querySelector('.page-content');
items.addEventListener('click', {handleEvent: fnCounter, e: event});

</script>

Dilettante_Pro 25.06.2018 12:58

Вот так снимается
<div class = 'page-content'>page-content
   <div >Content</div>
   <div class = 'item-actions__cart'>Content Cart</div>
   <div >Content</div>
</div>
<script>
var fnCounter = function (e) {
  var target = e.target;
  alert(target.textContent);
  if (target.classList.contains('item-actions__cart')) {
    items.removeEventListener('click', fnCounter);
  }
};


var items = document.querySelector('.page-content');
items.addEventListener('click', fnCounter);

</script>

Очевидно, EventListener считает, что fnCounter и handleEvent: fnCounter - разные функции

alecto 25.06.2018 12:58

Dilettante_Pro,
да, у меня тоже самое происходит.
событие срабатывает, но снять его не могу.

Dilettante_Pro 25.06.2018 13:15

alecto,
Пост 25 видели?

alecto 25.06.2018 13:36

да, теперь увидел.
решение оказалось очень простым.
спасибо огромное, ваш сайт просто незаменимый ресурс по JS!

Dilettante_Pro 25.06.2018 13:49

alecto,
Цитата:

Сообщение от alecto
ваш сайт просто незаменимый ресурс по JS!

Он точно так же и ваш!


Часовой пояс GMT +3, время: 18:27.