javascript - 在Javascript中的分页数字之间添加点

Question

我正在网站上进行分页，我使一切正常工作，但我无法理解分页数字用点显示的行为(以及因此实现)。 现在，我在列表中显示所有数字，并给出事件类(如果当前页面是这样的):

displayNumbers : function(numbPages, page){
            let pagEl = jQuery('.pagination__list');
            pagEl.empty();

            for( let i = 1; i <= numbPages; i++){
                let pageNumb = i;

                if(pageNumb === page) {
                    jQuery(pagEl).append(`<li class="active" data-numb="${pageNumb}">${pageNumb}</li>`);
                } else {
                    jQuery(pagEl).append(`<li data-numb="${pageNumb}">${pageNumb}</li>`);
                }
            }
        },

该函数的调用方式如下:

app.pagination.displayNumbers(app.numbPages, page);

其中 app.numbPages 是我总共有多少页的数字，page 是当前页面。

我想实现的是这样的:

1 | 2 | 3 | ... | 28 | 28 29 | 29 30

但行为如何？我也很难找到示例，因为现在的网站大多使用无限滚动。 不管怎样，我想我会有类似的东西:

1 | 2 | 3 | 4 |... | 29 | 29 30

但是如果我有第 8 页的示例会发生什么？

... | 6 | 7 | 8 | ... | 29 | 29 30 或者也许

1 | 2| ... | 7 | 8 | ... | 29 | 29 30 我不喜欢这些，我想坚持使用 max 1 ... 但如果这是通常的做法，我会这样做。

当然，任何实现提示(简单的 javascript 或 jquery)都非常受欢迎

Answer 1

大多数网站不会执行多个...，而是在末尾使用 < 和 > 来表明还有更多页面可用。

所以代替: ... | 6 | 7 | 8 | ... | 29 | 30

这将是 < | 6 | 7 | 8 | ... | 29 | 30

有些网站还在最后使用双箭头(<< 和 >>)，表示可以跳过第一页或最后一页。虽然通常会显示，但在不可用时它们可能会显示为灰色。

<< | < | 6 | 7 | 8 | ... | 29 | 30 | >>