Bootstrap Paginator Pagingプラグインのダウンロードアドレス:
GithubでVisitプロジェクトをダウンロードします
1.これは、ページに配置する必要があるJS関数です。
<span style = "font-size:14px;"> function paging(page){$ .ajax({type: "get"、url: "$ {ctx}/api/v1/user/1/"+(page-1)+"/5"、datatype: "json"、success:function(msg); $ .ajax({type: "get"、url: "$ {ctx}/api/v1/user/count/1"、datatype: "json"、success:function(msg){var pages = math.ceil(msg.data/5); Bootstrapmajorversion:3、currentPage://現在のページ番号fage:5、//ページに表示されます(5 lisはULで生成されます)。 } </span>ページ:
<span style = "font-size:14px;"> <ul id = "pageul"> </ul> </span>
*Liで自動的に生成されます
2.最も重要で核となることは、Bootstrap-Paginator.jsソースファイルを次のように変更することです。
<span style = "font-size:14px;"> onpageClicked:function(event、originalevent、type、page){//対応するページを表示し、クリック前にクリックされた新しく構築されたアイテムを取得し、var currentTarget = $(event.currentTarget); switch(type){case "first":currentTarget.bootStrappaginator( "showFirst");ページング(ページ);壊す; //前のページケース "prev":currenttarget.bootstrappaginator( "showprevious");ページング(ページ);壊す; case "next":currentTarget.bootStrappaginator( "shownext");ページング(ページ);壊す; case "last":currentTarget.bootStrappaginator( "showlast");ページング(ページ);壊す; case "page":currenttarget.bootstrappaginator( "show"、page);ページング(ページ);壊す; }}、</span>*クリックしたページスタイルの後、ページ(ページ)メソッドを呼び出します。ここのページソースファイルのパラメーターはすでに利用可能であるため、直接渡してください!
効果:スタイルが変更されたら、コントロールのページ値を直接使用してAJAXリクエストを送信します!最後に、更新されないページネーションが実装されます。
上記は、編集者によって導入された関連する知識で、Bootstrap Paginator Paging PluginとAJAXを組み合わせて、ダイナミックなリフレッシュフリーページネーション効果を実現します。私はそれが誰にでも役立つことを願っています。ご質問がある場合は、メッセージを残してください。編集者は、すべての人に時間内に返信します。 wulin.comのウェブサイトへのご支援ありがとうございます!