Xiaobai によるレイページ ページングの使用方法の簡単な紹介

WBOY
リリース: 2016-08-04 08:56:24
オリジナル
1274 人が閲覧しました

私は初心者なので、組み込みのページングを使用していました。その後、マスターがこれを勧めてくれたので、ページングは​​一般的に値を渡すためにGETを使用するので、一度実行したいと思います。検索、URL に検索値を追加する必要があります。そうしないと、次のページをクリックして検索条件が消去されてしまいます。(改善のための提案を歓迎します)。主に初心者で悩んでいる方、ぜひ見てください(励まし合いましょう)。
//这里是前端页面需要引入的文件,去 http://laypage.layui.com/ 官网下载放在项目下即可(我将文件放在了Public下,然后再调用出来),<script src="/Public/laypage/laypage.js"></script>//好像很实用的样子,后端的同学再也不用写分页逻辑了。这里只要复制进来就可以了。不用改<b><script></b><br> <b>laypage({<br>     cont: 'page11',<br>     pages: 18,</b> //假设我们获取到的是18(后端计算完总页数后将总页数值传过来,放在这里即可(类似{$totalpage})).<br>  <b>curr: function(){ </b>//通过url获取当前页,也可以同上(pages)方式获取<br> <b> var page = location.search.match(/page=(\d+)/);<br>         return page ? page[1] : 1;//如果没有页数显示时,默认是第一页<br>     }(), </b><br>    <b> jump: function(e, first){ </b>//触发分页后的回调<br>        <b> if(!first){</b> //一定要加此判断,否则初始时会无限刷新<br> <b>            location.href=setParam("page",e.curr);<br>         }<br>     }<br> });</b>//设置url中连接符(为什么要加这段呢?因为我们要带搜索条件时,一般的URL要带"?","&",这两个符号,这里就是为了,在追加页码时,当有了“?”符号时,会换成“&”,没有时则是“?”加page=页数,以下也是直接复制进去就可以了。)<b>function setParam(param,value){<br>     var query = location.search.substring(1);<br>     var p = new RegExp("(^|)" + param + "=([^&]*)(|$)");<br>     if(p.test(query)){<br>         //query = query.replace(p,"$1="+value);<br>         var firstParam=query.split(param)[0];<br>         var secondParam=query.split(param)[1];<br>         if(secondParam.indexOf("&")>-1){<br>             var lastPraam=secondParam.split("&")[1];<br>             return  '?'+firstParam+'&'+param+'='+value+'&'+lastPraam;<br>         }else{<br>             if(firstParam){<br>                 return '?'+firstParam+''+param+'='+value;<br>             }else{<br>                 return '?'+param+'='+value;<br>             }<br>         }<br>     }else{<br>         if(query == ''){<br>             return '?'+param+'='+value;<br>         }else{<br>             return '?'+query+'&'+param+'='+value;<br>         }<br>     }    <br> }<br> </script></b>//最后在你显示数据(例如后)最后添加下面这个<b><div style="margin-top:15px; text-align:center;" id="page11"></div></b>//上記の ID は自分で設定したものです。変更する場合は、前の続き「page11」に注意してください。これも変更する必要があります。これでフロントエンドの準備は完了です。
検索条件にURLアドレスも含める必要がある場合はこう書きました
//クリックして検索<b>$("#sou").bind("click",function(event){<br> Event.preventDefault();</b>//ここで理解できない場合は、自分で確認できます (イベントをキャンセルするデフォルトの動作は通常、<from> がある場合ですが、ない場合は直接削除します)。 <br> <b>var type=$("#type").val();</b>//仮想の検索条件値を取得<br> <b>var url=$(this).attr("souid");</b>//クリック時にジャンプするアドレスです (例: souid="<*:U('Custom/customorder')*&gt ; 「ジャンプアドレスは自分で変更してください)<br /> <b> window.location.href=url+"?typeid="+type;<br /> });</b> (初心者はこのようにしか書けません。申し訳ありませんが、基本的な JQ はまだ理解できるはずです!)

二。次に、バックエンド部分です<b>public function text(){</b><br /> //以下はGETで送信されたページ番号を取得するもので、ページ番号がない場合はページ番号が1になります<br />。 <b>$nowpage=I('ページ',1);</b><br /> //$totalpage は取得したい最大ページ数を計算するもので、ceil は四捨五入、ここでは 10 データを 1 ページとして設定しています(カッコに注意)。 <br /> <b>$totalpage=ceil((M('order')->where(条件)<br /> ->count())/10);//これは可能な限り省略されています。 <br> // 以下に、文章の limit(($nowpage-1)*10,10) を追加してください。これは、データが各ページに表示されるデータの数を制御することを意味し、ページ数を取得した後、設定されたページ数を掛けます。ページ上に 10 個のアイテムを取得するためのアイテム (自分で設定) データ<br> <b>$res=M('order')->where(条件)<br> ->limit(($nowpage-1)*10,10)<br> ->select();</b><br> //最後に、データと最大ページ数がフロントエンドに渡されて受け入れられます。 (必要に応じて検索条件も送信する必要があります) <br> <b> $this->assign("totalpage",$totalpage);<br> $this->assign("res",$res);</b><br> <b>}</b>

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のおすすめ
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート
私たちについて 免責事項 Sitemap
PHP中国語ウェブサイト:福祉オンライン PHP トレーニング,PHP 学習者の迅速な成長を支援します!