Добавление слушателя на динамически созданные объекты
Вложений: 1
Доброго времени суток.
Есть страничка, на которую скриптом, что ниже, запихиваются блоки с данными, взятыми из json. Выглядит это как-то так. function placeTiles(data,nFirst,nLast) { for(var i=nFirst;i<nLast;i++) { document.getElementById('content').innerHTML+= '<div class="container">' + '<div id="itemThumbImgUrl">' + '<img src=' + data[i].itemThumbImgUrl + '>' + '</div>' + '<span class="containerSpanName">' + data[i].itemTitle + '<br>' + data[i].price.min + '$-' + data[i].price.max + '$' + '</span>'+ '<div class="containerDivForButton№1" id="addToCartButton">' + '<span>Add to Cart</span>' + '</div>'+ '<div class="containerDivForButton№2">' + '<span>Compare</span>' + '</div>' + '</div>'; } } Всё было бы хорошо, только вот на серенькие кнопочки нужно повесить по обработчику. Однако листенеры не находят id созданного элемента(мб проблема заключается, в том, что я не представляю, куда эти листенеры запихивать. В файлике с данным кодом они были и перед, и после и даже в самой функции, означенной выше(и лишь там они хоть как-то выполнялись, но сразу же по созданию блоков, а не по клику)), а onclick'и, запиханные внуть innerHTML и вовсе не срабатывают. Сильно прошу вашей помощи и буду благодарен за советы. PS:А ещё сильно звиняюсь за говнокод и сумбурность в изложении мыслей..Так же в курсе, что innerHTML плохо, но оговорено было делать именно им, хотя я может чего-то и не понял.. |
Ну так при изменении innerHTML перезаписывается всё содержимое элемента. Соответственно старые элементы заменяются на новые с таким же содержимым, но обработчики то привязаны к старым, а старых больше нет, вот они не срабатывают. Так что либо переназначать все обработчики после любого изменения innerHTML, либо ставить обработчик на контейнер и смотреть по target откуда пришло событие. Либо писать вызов нужных функций в атрибут onсобытие создаваемых тегов. Ну или переписывать код по нормальному без innerHTML...
|
Часовой пояс GMT +3, время: 20:46. |