如何实现li菜单的上一页和下一页？

Question

http://blog.csdn.net/xidor/archive/2008/03/20/2200597.aspx可以参考这个

Answer 1

搜索的js分页不是针对li分页的啊。对li怎样分页？

Answer 2

用document.getElementById("a").getElementsByName("li").length个数 

Answer 3

<a href="#" onclick="return prepage()">上一页</a>
<ul id="nav"><!--是ul标签吧??给ul加个id-->
<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>
<li>21</li>
</ul>
<a href="#" onclick="return nextpage()">下一页</a><script type="text/javascript">
//大概的分页如下
var pagesize=10,pagecurrent=0,totalpage;//======分页变量定义//辅助函数
function $(id){return document.getElementById(id);}
function $s(o,tagName){return o.getElementsByTagName(tagName);}
//=================
window.onload=function(){
//计算总页数
 var len=$s($("nav"),"li").length;
 if(len%pagesize==0)totalpage=len/pagesize
 else totalpage=Math.floor(len/pagesize)+1;
 setState($s($('nav'),'li'));
}
//设置导航显示状态
function setState(li){
 var len=li.length,i;
 for(i=0;i<pagecurrent*10&&i<len;i++)li[i].style.display="none";
 for(;i<(pagecurrent*10+10)&&i<len;i++)li[i].style.display="block";
 for(;i<len;i++)li[i].style.display="none";
}
//下一页
function nextpage(){
 if(pagecurrent==(totalpage-1)){alert('已经是最后一页！');return false;}
 pagecurrent++;
 setState($s($('nav'),'li'));
 return false;
}
//上一页
function prepage(){
 if(pagecurrent==0){alert('已经是第一页！');return false;}
 pagecurrent--;
 setState($s($('nav'),'li'));
 return false;
}
</script>

Answer 4

//==========================================================================菜單分頁var pagesize=5,pagecurrent=0,totalpage;//======分页变量定义//辅助函数
function $(id){return document.getElementById(id);}
function $s(o,tagName){return o.getElementsByTagName(tagName);}
//=================
window.onload=function(){
//计算总页数
 var len=$s($("nav"),"li").length;
 if(len%pagesize==0)
 {totalpage=len/pagesize}
 else 
 {totalpage=Math.floor(len/pagesize)+1;}
 setState($s($('nav'),'li'));
}
//设置导航显示状态
function setState(li){
 var len=li.length,i;
 for(i=0;i<pagecurrent*pagesize&&i<len;i++)li[i].style.display="none";
 for(;i<(pagecurrent*pagesize+pagesize)&&i<len;i++)li[i].style.display="block";
 for(;i<len;i++)li[i].style.display="none";
}
//下一页
function nextpage()
{
// document.getElementById('pre').style.visibility="visible"
// document.getElementById('next').style.visibility="hidden"
   
 if(pagecurrent==(totalpage-1))
 {alert('已经是最后一页！');return false;}
 pagecurrent++;
 setState($s($('nav'),'li'));
 return false;
}
//上一页
function prepage(){
// document.getElementById('pre').style.visibility="hidden"
  // document.getElementById('next').style.visibility="visible"
   
 if(pagecurrent==0)
 {alert('已经是第一页！');return false;}
 pagecurrent--;
 setState($s($('nav'),'li'));
 return false;
}
//==================================================================================菜單分頁

Answer 5

js函数要和li菜单在同一个页面吗？