При добавлении HTML кода с помощью .prepend()|jQuery никакие события на добавленный код не срабатывают
if(incorrectURLs) {
$('#for_errors').prepend('' +
'<div class="message message--warning">'+icon+'' +
'<div class="message-body">' +
'<p class="message-text">' +
'Внимание!...' +
'</p>' +
'</div>' +
'<div class="message-close"></div></div>'
);
return false;
}
$('.message-close').on('click', function() {
console.log('sdsd');
$(this).closest('.message').hide();
});
в таком виде в логах ничего не происходит. Но если вставить тот же HTML код в дом дерево вручную, срабатывает без проблем. Почему не срабатывает при добавлении с помощью jQuery и как это решить?
Ответы (1 шт):
Автор решения: Алексей Шиманский
→ Ссылка
Заменить
$('.message-close').on('click', function() {
на
$(document).on('click', '.message-close', function() {
Не срабатывает потому. что слушатель вешается ДО того, как элемент появится на странице. Надо вешать слушателя либо сразу после добавления, либо делегировать событие элементу, который всегда на странице есть. В текущем примере это document