解決方案在這個 JSFiddle 中： https ://jsfiddle.net/rinku16/mpo7xyjk/17/當用戶單擊過濾器搜索并根據搜索條件在客戶端下載 JSON 時，我的分頁 JS 函數根據每頁的行數對行進行分區，并相應地在上一個和下一個按鈕之間制作數字導航按鈕。我有頁面導航按鈕和上一個/下一個按鈕的同步問題。我的問題如下例如：最初在搜索時單擊它只顯示表頭，但如果用戶按下下一個按鈕，它會顯示 (10-19) 10 條記錄在前 0-9 行之后繼續（跳過）但如果用戶單擊 0 導航按鈕（在上一個和下一個之間按鈕）但它顯示（0-1-2）3行（但它應該顯示0-9行），當點擊1個按鈕時它應該顯示（10-19）但它顯示（3-4-5）。我已經更新了這個 JSFiddle 鏈接（https://jsfiddle.net/rinku16/hn3t9gz6/33/）中的代碼，但它不能正常工作。我正在嘗試建立一個邏輯。您可以在鏈接上檢查所有邏輯。我無法完成以下任務。HTML：<html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script> <script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.4.1.min.js"></script> <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script> <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script> </head> <body> <div class="row"> <div class="col"> <div> Pagination Div <div id="pagination"></div> </div> </div> </div> <div class="row" style="overflow-x:auto;"> <div class="col"> <div> Records Div <div id="filterRecords"></div> </div> </div> </div> </body> </html>我想用分頁做兩件事。對行數進行分區示例：JSON 有 32 行，然后每頁有 10 行視圖，然后我的按鈕為1（10 行）、[2]（10 行）、[3]（10 行）、[4]（2 行） ) {我在鏈接中為此編寫了代碼}將焦點從一個按鈕移動到下一個按鈕（單擊下一個按鈕）1 -> [2] -> [3] -> [4]）{我沒有為此編寫代碼，因為它需要使用按鈕 id 更改 CSS（1 ->[2]->[3]->[4])}問題是按鈕單擊上一個和下一個與焦點按鈕不同步（1 ->[2]->[3]->[4]）。
如何在不使用 Bootstrap 的情況下在客戶端對 JSON 數據進行分頁？
繁花不似錦
2022-05-14 15:09:18
