テーブル内の列の数が長すぎる場合があり、ユーザーがクエリを行うのに役立たないため、JS を使用してテーブルをページ分割します。関連するコードは次のとおりです。 1.JSコード コードをコピー コードは次のとおりです: <br> var pageSize = 15; //各ページに表示されるレコード数<br> var curPage=0; //現在のページ<br> var lastPage; //最後のページ<br> var direct=0; //総行数<br> var begin;<br> var end; <br><br>最初の行は<br> == "ページを紹介しますdocument.getElementById("sjzl").innerHTML="総データ量" len "" // データ量を表示 <br> document.getElementById("pageSize").value = pageSize;<br><br> <br> curPage =1;<br> direct = 0;<br> displayPage();<br> });<br> $("#btn2").click( functionfrontPage(){ // 前のページ<br> direct =-1;<br> displayPage(); direct=1;<br>displayPage();<br> });<br> $("#btn4").click(function lastPage(){ // 最後のページ<br> curPage=page;<br> direct = 0;<br> displayPage();<br> }) ; If (!/^[ 1-9]d*$/.test(curPage)) {<br>場合(curPage > page) {<br> アラート (「過剰なデータ ページ」) <br> リターン; <br>} <br> Direct = 0; <br> DisplayPage () <br>}); "#pageSizeSet").click(function setPageSize(){ //各ページに表示されるレコード数を設定します🎜> if（！/^[1-9] d*$/。test（pagesize））{<br>🎜> len = $（ "#mytable tr"）。 pageSize==0 : Math.floor(len/pageSize) 1;//レコード数に基づいてページ数を計算します<br> curPage=1; });<br><br> function displayPage(){<br> if(curPage direct=0;<br>alert("すでに最初のページです ") ; <br> alert（ "これは最後のページです"）; <br>バグでは、年齢が0 <br> if（len＆gt; pagesize）{<br>} <br><br>innerhtml = " Current" Curpage "/" Page "page per page"; // 現在のページを表示します <br> <br> Begin = (Curpage 1)*PageSize 1; // 開始レコード番号 <br> END = begin 1*pageSize - 1; // 最後のレコード番号は <br><br> if(end > len ) end=len;<br> $("#mytable tr").hide(); // まず、この動作を次のように設定します。隠されている<br>; = end）|| <br> }<br> 2. HTML コード コードをコピー コードは次のとおりです: 記事 設定 ホームページ前のページ ;次のページ最後のページ 🎜>ページに移動しますジャンプ ...残りのテーブル コード 最終的なエフェクトの例は次のとおりです:
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
