慕容森
2022-05-14 14:00:02
使用 HTML 和 javascript,我有一些基本的搜索結果分頁,雖然可以,但如果有數百個結果,我最終可以得到如下所示的分頁:我想將此限制為僅顯示 1 - 10,然后是 11 - 10 等,任何人都可以指導我如何執行此操作的示例嗎?<div class="row igs-learning-paths-pagination-row"> <div class="col-12 d-flex justify-content-center" > <ul class="pagination pagination-info"> <li class="page-item"> <a href="javascript:void(0)" onclick="displayPreviousPage()" class="igs-learning-paths-pagingation-text igs-text-uppercase"> @Umbraco.GetDictionaryValue("Common Prev", "Prev..").ToUpper() </a> </li> @for (int i = 0; i <= @Model.Results.Count() / numberPerPage; i++) { <li class="@(i == 0 ? "active" : null) page-item non-generate-page-item" id="page-list-item-@(i)" style="border-radius:16px;"> <a class="page-link" id="page-number-@(i)" href="javascript:void(0)" onclick="displayPages(@(i))">@(i + 1)</a> </li> } <li class="page-item" alt="Go forward a page" title="Go forward a page"> <a href="javascript:void(0)" alt="Go forward a page" title="Go forward a page" onclick="displayNextPage()" class="igs-learning-paths-pagingation-text igs-text-uppercase search-result-margin"> @Current.UmbracoHelper.GetDictionaryValue("Common Next", "Next..").ToUpper() </a> </li> </ul> </div> </div>
1 回答

狐的傳說
TA貢獻1804條經驗 獲得超3個贊
const pageNumbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
const maxPageLimit = 5;
let upperPageIndex = maxPageLimit;
let currentPageIndex = 0;
let displayPages = pageNumbers.slice(currentPageIndex , upperPageIndex); // slice(startIndex, endIndex);
console.log(displayPages)
// if currentPageIndex = 2 then show 2 more as you go through
upperPageIndex += 2; // You can make 2 a constant if needed
currentPageIndex += 2;
displayPages = pageNumbers.slice(currentPageIndex , upperPageIndex);
console.log(displayPages)
參考:https ://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/slice
添加回答
舉報
0/150
提交
取消