在这里我有
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
<li>7</li>
<li>8</li>
<li>9</li>
<li>10</li>
<li>11</li>
<li>12</li>
<li>13</li>
<li>14</li>
<li>15</li>
<li>16</li>
<li>17</li>
<li>18</li>
<li>19</li>
<li>20</li>
</ul>
最初我只显示 10 li,但是当用户来到第 10 页时,我需要隐藏可见的 10 li 并显示接下来的 10 li,并且也应该使用 jquery 反之亦然......就像谷歌中的分页..
我试过下面的代码:
var currentIndex = $("div#pagination ul").children('li:visible').eq(-2).index();
var nextIndex = currentIndex + 10;
$("div#pagination ul li:not(':first'):not(':last')").hide();
$('div#pagination ul li:lt(' + nextIndex + '):gt(' + currentIndex + ')').show();
first & last li 是 prev & next 按钮,所以我需要在这些按钮之间显示和隐藏
谢谢 ...
解决方案:不是很有效,但有效...
解决方案 :
var e = currentPage,r=lastPage;
if(e >= 10 && e<20)
{
$("div#pagination ul li:not(':first'):not(':last')").hide();
$("div#pagination ul li:lt(21):gt(9)").show();
}
else if(e >=20)
{
$("div#pagination ul li:not(':first'):not(':last')").hide();
$("div#pagination ul li:lt("+(r+1)+"):gt(19)").show();
}
else
{
$("div#pagination ul li:not(':first'):not(':last')").hide();
$("div#pagination ul li:lt(11):gt(0)").show();
}