Javascript生成分頁編號

Question

我正在嘗試生成分頁按鈕。

我想按鈕看起來像這樣：

• ，2，3 ... 7
• ，3，4 ... 7
• ，4，5 ... 7.
• ，5，6 ... 7.
• ，6,7
• 5，，7.
• 5，6，7 。

黑色數字是選定頁面，7是最高頁面。

我目前的功能直到你在最後3頁爲止。

[1, 2, 3, "...", 7] 
[2, 3, 4, "...", 7] 
[3, 4, 5, "...", 7] 
[4, 5, 6, "...", 7] 
[5, 6, 7] 
[6, 7] 
[7] 

我希望它是什麼樣子：

[1, 2, 3, "...", 7] 
[2, 3, 4, "...", 7] 
[3, 4, 5, "...", 7] 
[4, 5, 6, "...", 7] 
[5, 6, 7] 
[5, 6, 7] 
[5, 6, 7] 

的Javascript：

var test = function (count, current) { 
    this.pageCountArray = []; 

    var shownPageNumbers = 3; 


    for (var i = current; i <= count; i++) { 
     if (this.pageCountArray.length < shownPageNumbers) { 
      this.pageCountArray.push(i); 
     } 
     else { 
      this.pageCountArray.push('...'); 
      this.pageCountArray.push(count); 
      break; 
     } 
    } 

    console.log(this.pageCountArray); 
} 

使用：

test(7, 1); 
test(7, 2); 
test(7, 3); 
test(7, 4); 
test(7, 5); 
test(7, 6); 
test(7, 7); 

console.clear(); 
 
var test = function (count, current) { 
 
    this.pageCountArray = []; 
 

 
    var shownPageNumbers = 3; 
 

 

 
    for (var i = current; i <= count; i++) { 
 
     if (this.pageCountArray.length < shownPageNumbers) { 
 
      this.pageCountArray.push(i); 
 
     } 
 
     else { 
 
      this.pageCountArray.push('...'); 
 
      this.pageCountArray.push(count); 
 
      break; 
 
     } 
 
    } 
 

 
    console.log(this.pageCountArray); 
 
    
 
    document.write(JSON.stringify(this.pageCountArray)) 
 
} 
 

 
test(7, 1); 
 
test(7, 2); 
 
test(7, 3); 
 
test(7, 4); 
 
test(7, 5); 
 
test(7, 6); 
 
test(7, 7);

Answer 1

您的問題是，你是你的填充陣列只能從current到count。所以，當你的current的值高於count - (shownPageNumbers - 1)時，你需要讓for循環從count - (shownPageNumbers - 1)開始，而不是從current開始，以顯示正確的頁碼數量。你可以在for循環檢查if（current>（count - （shownPageNumbers - 1））並更新當前值，或者在for循環中設置i = min（current，（count - （ shownPageNumbers - 1））

Answer 2

這是我將如何實現它：

function pageNumbers(count, current) { 
    var shownPages = 3; 
    var result = []; 
    if (current > count - shownPages) { 
     result.push(count - 2, count - 1, count); 
    } else { 
     result.push(current, current + 1, current + 2, '...', count); 
    } 
    return result; 
} 

例子：http://jsfiddle.net/howderek/x474jtsd/