Javascript Array拼接方法使用正向后退按鈕一次顯示50個項目

Question

大家好，我有一個數組，我想使用上一個和下一個按鈕滾動瀏覽。 如何使用數組拼接方法執行此操作並跟蹤數組索引？ 我總是以50人為一組展示

//Previous page button calls this function
var previousPage = function(){
   pageCount = pageCount -50;
   arraySlice = peopleArray.slice(pageCount -50, pageCount);
   for(i = 0; i<arraySlice.length;i++){
       var key = arraySlice[i];
       createCircles(key.gplusUrl, key.gplusImg, divId, key.displayName, divId);
   }
};


//Next page button calls next page function
var nextPage = function(){

   //I am using pageCount for the index pageCount
   //I increment the pageCount by 50


      pageCount = pageCount +50; 
       //Splice the 
       arraySlice = peopleArray.slice(pageCount, pageCount +50);

      //Loop through the array I sliced
      for(i = 0; i<arraySlice.length;i++){
          key = arraySlice[i];
          //This function displays the items from the array you can ignore this
          createCircles(key.gplusUrl, key.gplusImg, divId, key.displayName, divId);
      }
   };

Answer 1

假設您當前的pageCount在巨型數組中為200：

<----- 100 ----- 150 ----- 200 ----- 250 ----- 300 ----->

調用nextPage()會發生什么？ 您將pageCount增加到250，然后從（pageCount，pageCount + 50）切成（250-300）。 因此，現在您最終顯示了陣列的這一部分：

<----- 100 ----- 150 ----- 200 ----- 250 ----- 300 ----->

接下來，假設您調用了previousPage() 。 您將pageCount遞減到200，然后從（pageCount-50，pageCount）切成（150-200）。 因此，您最終將顯示以下部分：

<----- 100 ----- 150 ----- 200 ----- 250 ----- 300 ----->

調用nextPage()將再次顯示（250-300）。 注意它不可能顯示（200-250）？

原因是因為在您的PreviousPage實現中，您將pageCount遞減了50，然后選擇選擇它之前的50個項目。 從本質上講，當您只想返回50時，您已將選擇項下移了100。將您以前的Page實現更改為也從（pageCount，pageCount + 50）中進行切片。

另外，請確保在遞減pageCount之后檢查它是否為負數，因為最終會從數組末尾進行選擇。