Блог

Итак, я использую сценарий бесконечной прокрутки, чтобы пользователю не приходилось переходить на следующую страницу, чтобы просмотреть больше товаров в Woocommerce. Все работает отлично, за исключением…

На iPhone (и iPad) изображения, которые технически были бы на следующей странице, вообще не загружаются, как только запускается «Загрузить больше»… так, например, если у меня отображается 1-8 продуктов, и я прокручиваю вниз — отображаются остальные продукты, но загружаются только изображения для начальных 1-8 продуктов, а остальные нет.

Я безуспешно пытался исправить ошибки… просто интересно, сталкивался ли кто-нибудь еще с этим и смог ли найти исправление?

 <script>
    var elem = document.querySelector('.shop-section');
    var infScroll = new InfiniteScroll( elem, {
      // options
      path: '.woocommerce-pagination a.next',
      append: '.products',
      hideNav: '.woocommerce-pagination',
      history: false,
      status: '.page-load-status',
    });

    // iPhone Bug Fix
    infScroll.on( 'append', function( response, path, items ) {
      for ( var i=0; i < items.length; i   ) {
        reloadSrcsetImgs( item[i] );
      }
    });

    function reloadSrcsetImgs( item ) {
      var imgs = item.querySelectorAll('img[srcset]');
      for ( var i=0; i < imgs.length; i   ) {
        var img = imgs[i];
        img.outerHTML = img.outerHTML;
      }
    }

</script>
  

РЕДАКТИРОВАТЬ: я должен также добавить, что я заметил ошибку в консоли следующим образом:

 Uncaught ReferenceError: item is not defined
    at InfiniteScroll.<anonymous> ((index):970)
    at InfiniteScroll.proto.emitEvent (infinite-scroll.js?ver=1:254)
    at InfiniteScroll.proto.dispatchEvent (infinite-scroll.js?ver=1:688)
    at InfiniteScroll.<anonymous> (infinite-scroll.js?ver=1:1069)
    at InfiniteScroll.proto.appendNextPage (infinite-scroll.js?ver=1:1076)
    at InfiniteScroll.proto.onPageLoad (infinite-scroll.js?ver=1:1052)
    at InfiniteScroll.<anonymous> (infinite-scroll.js?ver=1:1029)
    at XMLHttpRequest.req.onload (infinite-scroll.js?ver=1:1249)