Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Обработчик для созданного элемента дома (https://javascript.ru/forum/dom-window/76183-obrabotchik-dlya-sozdannogo-ehlementa-doma.html)

Sergii Prudkii 12.12.2018 00:27

Обработчик для созданного элемента дома
 
Всем бобра. Не могу разобраться в такой ситуации:
К каждому элементу списка добавляю элемент - кнопку
spanEl.insertAdjacentHTML("beforeEnd", `<button class='menuList' onclick="clickButMenu()"><p>ttt</p></button>`)

создал функцию clickButMenu
clickButMenu = function () {
      alert(this.innerHTML)
    }

Но при клике на кнопку ее содержимое не определено, в отличии если бы я написал так:
spanEl.insertAdjacentHTML("beforeEnd", `<button class='menuList' onclick="alert(this.innerHTML)"><p>ttt</p></button>`)

Почему не работает первый вариант и как правильно реализовать функцию ?

Alexandroppolus 12.12.2018 02:45

Повесить онклик на родительский элемент, использовать делегирование

j0hnik 12.12.2018 04:26

Sergii Prudkii,
потому что this в функции ссылается на window, чтобы работало его нужно передать аргументом
spanEl.insertAdjacentHTML("beforeEnd", `<button class='menuList' onclick="clickButMenu(this)"><p>ttt</p></button>`)
var clickButMenu = function (th) {
      alert(th.innerHTML)
    }

Sergii Prudkii 12.12.2018 18:56

Огромнейшее тебе спасибо )


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