Как перезагрузить скрипт после добавления элемента в DOM - PullRequest
0 голосов
/ 19 сентября 2018

Здравствуйте, я работаю с LIKEBTN У меня есть несколько проектов, на которых мне нужны лайки, и я добавил библиотеку likebtn к проектам, но есть еще загрузка, которая получает старые проекты также и после ajaxHTML добавляется на страницу, и там я не могу загрузить, как библиотеку кнопок.Как скрипт загружался раньше при загрузке страницы, так что он не добавляется в новые элементы DOM.Я пробовал. live и .delegate, но не смог найти решение.

Before Load More Вы можете видеть, что есть значок сердца, который имеет аналогичные функции ив консоли вы также найдете дочерние элементы внутри <span>, которые загружаются библиотекой likebtn, но после того, как я загрузил больше проектов с помощью ajax, я не смог загрузить likebtn библиотечные скрипты для этих элементов, вы можете увидеть изображение, которого нетзначок и в консоли нет дочерних элементов внутри <span>.

After Load more

Это мой html, который добавляется в AJAX нагрузки больше.у нее есть динамическая переменная, поступающая из базы данных.

                <a data-index="{{ loop.index0 }}" class="galimg animate" data-animation="fadeInUp" data-duration="010">
                 <div class="gimg">
                    <img class="img-fluid" src="{% path (design.designThumbnail), 'thumbnail' %}" alt="" />
                    <div class="gimg-caption">
                        <div class="title">
                            <h6>{{ design.title }}</h6>
                            <p>By: {{ (design.userId.userFullname!= ' ')? design.userId.userFullname|uppercase_first_letter : design.userId.contactName|uppercase_first_letter }}</p>
                            <p>From: United Kingdom</p>
                        </div>
                        <div class="likes">=
                            <!-- LikeBtn.com BEGIN -->
                            <span class="likebtn-wrapper" data-theme="custom" data-icon_size="24" data-icon_l="hrt6" data-icon_d="sml3-u" data-icon_l_c="#ffffff" data-icon_l_c_v="#fb0505" data-label_c="#ffffff" data-label_c_v="#ffffff" data-counter_l_c="#ffffff" data-bg_c="rgba(250,250,250,0)" data-bg_c_v="rgba(250,250,250,0)" data-brdr_c="rgba(198,198,198,0)" data-i18n_like="Love this" data-white_label="true" data-identifier="btn_design_{{ loop.index }}" data-dislike_enabled="false" data-icon_dislike_show="false" data-counter_zero_show="true" data-popup_disabled="true" data-share_enabled="false" data-tooltip_enabled="false" data-site_id="5b7ac72c6fd08b366d431a36"></span>
                            <!-- LikeBtn.com END -->
                        </div>
                    </div>
                 </div>
            </a>

Это библиотека, которую мне нужно загрузить после ajax succes

<script>(function(d,e,s) {if(d.getElementById("likebtn_wjs"))return;a=d.createElement(e);m=d.getElementsByTagName(e)[0];a.async=1;a.id="likebtn_wjs";a.src=s;m.parentNode.insertBefore(a, m)})(document,"script","//w.likebtn.com/js/w/widget.js");</script>

1 Ответ

0 голосов
/ 19 сентября 2018

Вы можете использовать метод init () после успеха ajax.Это сделает ваши новые элементы.

if (typeof(LikeBtn) != "undefined") {
    LikeBtn.init();
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...