jQuery不適用於jScroll顯示的項目（無限滾動）

Question

我在Laravel 5.1應用程序中使用jScroll（ jscroll.com ）進行無限滾動。 我進一步使用了一些jquery，我希望在單擊每個帖子的“贊”按鈕時將其觸發。 jQuery在第一頁的帖子（即localhost/myproject/index但是對於下一頁（即localhost/myproject/index?page=2等）由jScroll追加的帖子，不會觸發jQuery。

這是我顯示帖子的代碼：

    @foreach($posts as $post)
        <div class="panel panel-default">
            <div class="panel-body post">
                <h3>{{ $post->title }}</h3>
                <hr>
                <p>{{ $post->discripion }}</p>
            </div>
            <div class="panel-footer">
                <div class="btn-group">
                    <button type="button" data-id="{{$post->id}}" class="btn btn-default like-btn">Like</button>
                </div>
            </div>
    </div>
@endforeach

我想為每個帖子觸發的簡單jQuery是：

<script type="text/javascript">
            $('button.like-btn').on('click',function(){
                var post_id = $(this).data('id');
                alert('Liked post with id = ' + post_id);

            });
        </script>

Answer 1

這是因為jquery不會綁定到那些元素（它們最初不在DOM中）。 而是將其綁定到文檔，如下所示：

$(document).on("click", 'button.like-btn', function(event) { 
    alert("new link clicked!");
});

看這里多一點