Question

我无法将Infinity Scroll应用到我的laravel网站。

在Google Chrome开发日志中，没有错误，

但是当我进入浏览网格时它不起作用。

只显示一个标准的Laravel网格，底部带有分页链接

{{ HTML::script('assets/js/jquery.infinitescroll.js') }}

<script type="text/javascript">
$(function() {
    $('#boxes').infinitescroll({
    navSelector     : ".paginate",
    nextSelector    : ".paginate a:last",
    itemSelector    : ".box",
    debug           : false,
    dataType        : 'html',
    path: function(index) {
        return "?page=" + index;
    }
}, function(newElements, data, url){

    var $newElems = $( newElements );
    $('#boxes').masonry( 'appended', $newElems, true);

});
});
</script>

Laravel Blade

    <div id="boxes" class="browse-grid">    
        @if ( ! $data->isEmpty())
            @foreach($data as $k => $r)
                   <figure class="col-sm-3 col-lg-2 col-xs-6" >
                   <div class="img-container">
                    </div>        
                </figure>

            @endforeach

        @else
            <div><h3 class="reviews-not-released"> {{ trans('main.no results') }}</h3></div>
        @endif

    </div> 
    {{ $data->appends(array())->links() }}

我复制了代码 Laravel and Infinite Scroll

但无限滚动只是不适合我。我的分页看起来像这样。

 <div class="row pagination-top">      <ul class="pagination">
            <li><a href="http://test123.com/agents?page=2">2</a></li><li><a href="http://test123.com/agents?page=3">3</a></li><li><a href="http://test123.com/agents?page=4">4</a></li><li><a href="http://test123.com/agents?page=5">5</a></li><li><a href="http://test123.com/agents?page=6">6</a></li><li><a href="http://test123.com/agents?page=7">7</a></li><li><a href="http://test123.com/agents?page=8">8</a></li><li><a href="http://test123.com/agents?page=9">9</a></li><li><a href="http://test123.com/agents?page=2">&raquo;</a></li> </ul>

Answer 1

迟到的答案，但是如果您仍然在寻找解决方案，或者其他人对此有疑问，请帮助您。

对我来说有什么帮助，我只是改变了

$('#boxes').infinitescroll({

为：

$('.pagination').infinitescroll({

虽然最后我使用了jscroll而不是无限卷轴，但我自己发现它好多了。同样的变化（取自您提供的链接中的示例）：

$('.scroll').jscroll({

于： $（＆＃39; .pagination＆＃39）。jscroll（{

我花了两天时间搞清楚这一点，最后让它发挥作用，希望能帮助有需要的人！

Laravel和Infinite Scroll没有显示

1 个答案: