使用HTML部分進行無限加載

Question

基本上，我正在嘗試使用more load來在產品列表上創建無限加載頁面，並在分頁上觸發click事件。

我的問題是，我可以將下一頁加載到HTML中，但是它將引入整個HTML文件，而不僅僅是產品。

我正在嘗試使用HTML部分將下一頁產品附加到當前div中。

這是我目前的JS。

$(".page-next a").on("click", function (e) {
      e.preventDefault();
       var partial = "@Html.Partial('_ProductWithHover')";
       var url = $(this).data('url');
       $.ajax({url: url,method: 'GET',dataType: 'html', success: function (data) {
       $('#js-infinite-scroll-page').append(partial);
        }
     });
});

不知道我是否應該按自己的方式包括自己的部分內容，因此，有關如何使此工作正常進行的任何反饋或建議都很好。

提前致謝！

Answer 1

由於這是異步行為，您可能應該更改后端api以使用必要的json進行響應，並在客戶端上構建dom。 那更容易。 另外，我沒有完全看到，您如何向后端服務提供有關無限加載的當前狀態的信息。

因此，無限加載是一種榮耀的分頁，它的工作方式如下：

最初，您渲染了一些元素，當滾動足夠時，觸發了加載下n個元素的請求，然后將它們附加到列表中。 為此，您必須讓后端知道您的立場，然后后端可以返回接下來的n個元素。