Скрипт не работает на элементах внутри бесконечной прокрутки - PullRequest
Новая
       12

Скрипт не работает на элементах внутри бесконечной прокрутки

0 голосов
/ 16 февраля 2019

Я ввел бесконечную прокрутку в своем коде, и теперь скрипт «Мне нравится» не работает: страница обновляется, когда я нажимаю кнопку «Мне нравится».

Скрипт Like-BTN: 

 <script>
         $(document).ready(function(){
            function updateText(btn, newCount, iconClass, verb){
                verb = verb || "";
                $(btn).html(newCount + '&nbsp<i class="' + iconClass + '"style="font-size:15px;"></i>' + verb )  
                btn.attr("data-likes", newCount)
            }

            $('.infinite-container').on("click", ".like-btn",(function(e){
                e.preventDefault()
                var this_ = $(this)
                var likeUrl = this_.attr("data-href")
                var likeCount = parseInt(this_.attr("data-likes")) | 0
                var addLike = likeCount + 1
                var removeLike = likeCount - 1

                if (likeUrl){
                    $.ajax({
                        url: likeUrl,
                        method: "GET",
                        data: {},
                        success: function(data){
                            console.log(data)
                            var newLikes;
                            if (data.liked){
                                updateText(this_, addLike, "fas fa-heart")
                            } else {
                                updateText(this_, removeLike, "far fa-heart")
                            }
                        }, error: function(error){
                            console.log(error)
                            console.log("error")
                        }
                    })
                }
            })
        })

    </script>

Скрипт бесконечной прокрутки 

       <script>
            var infinite = new Waypoint.Infinite({
            element: $('.infinite-container')[0],
            onBeforePageLoad: function () {
            $('.loading').show();
                          },
            onAfterPageLoad: function ($items) {
            $('.loading').hide();
            }
            });
         </script>

Бесконечная прокрутка работает правильно, но в элементах, заряженных после бесконечной прокрутки, скрипт like-btnне работает.

Может кто-нибудь увидеть, в чем проблема?

Спасибо за помощь!

1 Ответ

0 голосов
/ 16 февраля 2019

Функция click применяется только к элементам, которые существуют, когда она определена.Вместо этого вы должны использовать on, чтобы оно применялось к элементам, которые добавляются динамически: 

$('.infinite-container').on("click", ".like-btn", function(e){
...