思路:
通過 hide() 隐藏和 show() 顯示。
點選目前頁中的下一頁按鈕,先擷取這一頁的index索引。
擷取索引,除了下一頁所有頁面隐藏。
HTML:
<div class="items-top">
<div class="top">
<i class="iconfont icon-fanhui"></i>
<i class="iconfont icon-gengduo"></i>
<div class="inner" >
<p>你好</p>
</div>
</div>
<div class="top">
<i class="iconfont icon-fanhui"></i>
<i class="iconfont icon-gengduo"></i>
<div class="inner" >
<p>HELLO</p>
</div>
</div>
</div>
JQ:
var top = $(".top");
top.hide();
$(".items-top .top").eq(0).show();
//下一 頁
$(".icon-gengduo").click(function () {
var num = $(this).parent().index() + ;
top.hide();
$(".items-top .top").eq(num).show();
if (num == top.length) {
$(".items-top .top").eq(0).show();
}
});
//上一頁
$(".icon-fanhui").click(function () {
var num = $(this).parent().index() - ;
top.hide();
console.log(num);
$(".items-top .top").eq(num).show();
});