1

在这里我有

<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();
}
4

0 回答 0