###実現したいこと
jQueryでリンクを押下した際、表示される項目を変更したいと思っています。
現ページに全件の100件表示している状態から10件のみshow()で表示していて、
<a>タグのページ番号(例えば2)を押下した時に次の10件がずれて一番上に来たような実装というのは可能でしょうか?
いわゆる1~10件(1ページ目)をhide()し、11-20件(2ページ目)をshow()で表示、一番上に持ってくる。
ということをしたいです。
###ソースコード
php
1list.php 2<script type="text/javascript" src="/js/search.js"></script><!-- 検索結果一覧 --> 3 4 5<!-- paging --> 6 <div class="paging"> 7 <div class="number"> 8 1~20 / 100 件</li> 9 </div> 10 <ul class="pagination"> 11 <li class="disabled"><span>«</span></li> 12 <li class="active"><span>1</span></li> 13 <li><a href="">2</a></li> 14 <li><a href="">3</a></li> 15 <li><a href="">4</a></li> 16 <li><a href="" rel="next">»</a></li> 17 </ul> 18</div><!-- /paging --> 19 20@foreach($items as $item) 21 <li class="item"><a href="/?item={{ $item }}> </a>{{ $item }}</li> 22@endforeach 23
100件は固定なので、1ページ辺り10件で表示させたいと思っています。
var n = 10; var contents = $('.item'); $(contents).slice(n).hide();
上記のように1ページあたりに表示される件数は制御できたのですが2ページ目のリンク先で次の10件を先頭に表示させる実装方法がわかりませんでした。
###補足情報
プラグインは導入しない予定です。(Bootstrapを使用せず実装できるならやりたいですがその方法もわかりません、、)
よろしくお願いします。
私の質問内容が悪く、みなさまにページネーションの実装サンプルコードをご回答いただいてしまいました。
すみません。
実現したいこととして修正しましたのでお力いただければと思います。
回答5件
あなたの回答
tips
プレビュー