Jquery 未找到jScroll.js nextSelector-正在销毁

Jquery 未找到jScroll.js nextSelector-正在销毁,jquery,laravel,infinite-scroll,jquery-jscroll,Jquery,Laravel,Infinite Scroll,Jquery Jscroll,我试图用jScroll.js和laravel5.7实现无限滚动。我的代码如下,因为我遵循了所有教程以及Stackoverflow的所有问题和答案,所以我无法让它工作。在控制台上,它给出了jScroll:nextSelector未找到-正在销毁 <div class="infinite-scroll"> @foreach ($products as $category_products) <div class="col-lg-3 col-md-4 col-xs-6 thu

我试图用jScroll.js和laravel5.7实现无限滚动。我的代码如下,因为我遵循了所有教程以及Stackoverflow的所有问题和答案,所以我无法让它工作。在控制台上,它给出了
jScroll:nextSelector未找到-正在销毁

<div class="infinite-scroll">
  @foreach ($products as $category_products)
  <div class="col-lg-3 col-md-4 col-xs-6 thumb">
    <a href="/product/{{ $category_products->slug }}">
      <div class="shadow card mb-2">
        <!--Card image-->
        <div class="view overlay">
          <img class="card-img-top" src="{{ Storage::url($category_products->photos()->first()->filename) }}" alt="{{ $category_products->name }}" />
          <a href="/product/{{ $category_products->slug }}">
            <div class="mask rgba-white-slight"></div>
          </a>
        </div>

        <!--Card content-->
        <div class="card-body">
          <!--Title-->
          <h4 class="card-title notokufi">{{ $category_products->name }}</h4>
          <!--Text-->
          <p class="card-text notonaskh">
            {{ $category_products->description }}
          </p>
          <div class="row">
            <div class="col">
              <p><span class="text-accent">نرخ: {{ $category_products->display_price }}</span></p>
            </div>
            <div class="col">
              <p class="float-right">شار: {{ $category_products->city->name }}</p>
            </div>
          </div>
        </div>
      </div>
    </a>
  </div>
  @endforeach
  {{ $products->links() }}
</div>

@foreach($类别产品)
{{$category_products->name}

{{$category_products->description}

ن!\1582:{{$category\产品->显示\价格}

@endforeach {{$products->links()}
Javascript代码:

<script type="text/javascript">
$('ul.pagination').hide();
$(function() {
    $('.infinite-scroll').jscroll({
        autoTrigger: true,
        debug: true,
        loadingHtml: '<img class="center-block" src="http://demo.itsolutionstuff.com/plugin/loader.gif" alt="Loading..." />', // MAKE SURE THAT YOU PUT THE CORRECT IMG PATH
        padding: 0,
        nextSelector: '.pagination li.active + li a',
        contentSelector: 'div.infinite-scroll',
        callback: function() {
            $('ul.pagination').remove();
        }
    });
});

$('ul.pagination').hide();
$(函数(){
$('.infinite scroll').jscroll({
自动触发:是的,
是的,
loadingHtml:“”,//确保您放置了正确的IMG路径
填充:0,
下一个选择器:'.pagination li.active+li a',
contentSelector:'div.infinite-scroll',
回调:函数(){
$('ul.pagination').remove();
}
});
});

这是用于分页的DOM,但它是隐藏的,但由于我不是javascript开发人员,我可能不了解DOM,也不太了解它

<ul class="pagination" role="navigation">
  <li class="page-item disabled" aria-disabled="true" aria-label="« Pre">
    <span class="page-link" aria-hidden="true">‹</span>
  </li>

  <li class="active"><a href="#">1</a></li>

  <li class="page-item">
    <a
      class="page-link"
      href="http://example.com/product/example?page=3"
      >3</a
    >
  </li>
  <li class="page-item">
    <a
      class="page-link"
      href="http://example.com/product/example?page=4"
      >4</a
    >
  </li>
  <li class="page-item">
    <a
      class="page-link"
      href="http://example.com/product/example?page=5"
      >5</a
    >
  </li>
  <li class="page-item">
    <a
      class="page-link"
      href="http://example.com/product/example?page=6"
      >6</a
    >
  </li>
  <li class="page-item">
    <a
      class="page-link"
      href="http://example.com/product/example?page=7"
      >7</a
    >
  </li>
  <li class="page-item">
    <a
      class="page-link"
      href="http://example.com/product/example?page=8"
      >8</a
    >
  </li>

  <li class="page-item disabled" aria-disabled="true">
    <span class="page-link">...</span>
  </li>

  <li class="page-item">
    <a
      class="page-link"
      href="http://example.com/product/example?page=22"
      >22</a
    >
  </li>
  <li class="page-item">
    <a
      class="page-link"
      href="http://example.com/product/example?page=23"
      >23</a
    >
  </li>

  <li class="page-item">
    <a
      class="page-link"
      href="http://example.com/product/example?page=2"
      rel="next"
      aria-label="Next »"
      >›</a
    >
  </li>
</ul>
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • ...
  • 22
  • 23

您在该链接上检查了什么?您是否确认已找到分页li.active+li标记?或者不是。是的,我肯定li.active+li a在那里,但它是hidden@RafiUllahPatel我也更新了包含DOM的问题。thanksI确实删除了
$('ul.pagination').hide()但它仍然抛出错误。