@DeniSidorenko

Как сделать что бы js видел новые элементы DOM?

Привет ребята. Проблема вот в чем. использую стилизованную загрузку файлов, которая часто можно видеть на страницах добавление товаров и.т.д. Так вот сделал функцию что бы при клике на элемент был console.log, это для проверки. Нажимаю ничего. Проверил точно ли нажимаю на данный элемент. Точно на него. Начал искать почему и понял .Дело в том что структуру на которую я нажимаю загружается после того как я выберу файл , это после загрузки страницы и js файла, и как я понимаю js не отслеживает появление новых элементов в DOm дерево. Подскажите какое решение тут требуется

UPD:

Привет, знаю что есть точно такой же вопрос но дело в том что пробовал и не работает
$('img.star').on('click',function(){
    console.log('hi');
})

IMG с классом star появляется только тогда когда пользователь добавить изображение, т.е не изначально. Но тем не менее не работает Если использую такой код работает но при одном клике получается по возрастанию. Т.е кликаю один раз а там показывает что 100, потом 600 крч баг
$(document).on('click' ,function(){
$('img.star').on('click',function(){
    console.log('hi');
})
});
  • Вопрос задан
  • 278 просмотров
Решения вопроса 1
Воу, воу. По осторожней. Это не баг. Это логика работы. Вот:

$(document).on('click', 'img.star', function(){
    console.log("hi");
});


Почему так? Если после загрузки js добавить новые элементы, то на них не будет еще обработчика события. Поэтому мы ставим обработчик события на корневом элементе(потому что он уже загружен), и т.к. событие клика всплывает вверх по DOM, то корневой элемент всегда(почти всегда, т.к. всплытие можно остановить в "ручную") получает это события. По этому, мы говорим ему: "Лови событие click, и если инициатором данного события является элемент с таким-то селектором, то выполни такую то функция."
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы