Почему onclick не видит функцию?

Question

[bzotsss]

Всем привет , имеется такая проблема . Я на динамически формирующийся dom - элемент вешаю через onclick функцию
вот так :

<div class="selected_checkboxes-сancel" onclick="deleteSelectedItem()">&#10006;</div>

эту функцию обьявляю через function declaration . script подключаю в конце html'a . В чём может быть проблема ? Не видит функцию ( undefined )

Comments

[Алексей Скляров]

Вот почему

[Vladislav]

class="selected_checkboxes"Cancel" эт че такое

[bzotsss]

Алексей Скляров, Спасибо , знал про делегирование но решил попробовать именно такой подход . Мне интересно почему не видит функцию .... ? В чём проблема .. В области видимости ? Или что мешает ..

[bzotsss]

Владислав, Ошибка , извиняюсь . Щас исправлю

Answer 1

[ThunderCat]

Коротко и упрощенно - на момент бинда функции к элементу функция не декларирована. А хтмл требует ее привязать. А ее нету еще...

Comments

[Сергей Василенко]

Это хорошее объяснение.
т.е. событие on может привязывать динамически созданные элементы html вот так
$(селектор).on('click'

а в данном случае (автора вопроса)

onclick это как $(селектор).click(

Поэтому я могу вставить в начале html документа

<script>
function formProductData(name, url){
    //какой-то код
}
</script>

или подключить файл main.js с функцией formProductData() - при этом не оборачивая в $(document).ready(function()

У меня только так работает

Answer 2

[Dennis]

Попробуй обернуть функцию в такую конструкцию

window.addEventListener('DOMContentLoaded', () => {
function someFunc() {}
})

А лучше оберни сюда весь js