jQuery客户端分页

openkk 12年前

 <script src="/js/jquery-1.4.1.js" type="text/javascript"></script>      <script type="text/javascript">          var pageindex = 1;          var pagesize = 2;          $(function () {              previous();          })          function previous() {              if (pageindex < 1 || pageindex == 1) {                  pageindex = 1;                  $("#imgdiv img:lt(" + pagesize + ")").show();                  $("#imgdiv img").not($("#imgdiv img:lt(" + pagesize + ")")).hide();              }              else {                  pageindex--;                  if (pageindex != 1) {                      $("#imgdiv img:gt(" + ((pageindex - 1) * pagesize - 1) + "):lt(" + pagesize + ")").show();                      $("#imgdiv img").not($("#imgdiv img:gt(" + ((pageindex - 1) * pagesize - 1) + "):lt(" + pagesize + ")")).hide();                  }                  if (pageindex == 1) {                      $("#imgdiv img:lt(" + pagesize + ")").show();                      $("#imgdiv img").not($("#imgdiv img:lt(" + pagesize + ")")).hide();                  }              }          }          function next() {              var p = $("#imgdiv img").length / pagesize;                var pagecount = parseInt(Math.ceil(p));                if (pageindex + 1 > pagecount) {                  pageindex = pagecount;              } else {                  pageindex++;              }              $("#imgdiv img:gt(" + ((pageindex - 1) * pagesize - 1) + "):lt(" + pagesize + ")").show();              $("#imgdiv img").not($("#imgdiv img:gt(" + ((pageindex - 1) * pagesize - 1) + "):lt(" + pagesize + ")")).hide();          }      </script>   <div>          <a href="javascript:previous()">上一页</a>          <div id="imgdiv">              <img src="/images/001.jpg" alt="第一页的第一张"/>              <img src="/images/002.jpg" />              <img src="/images/003.jpg" />              <img src="/images/004.jpg" />              <img src="/images/005.jpg" />           </div>          <a href="javascript:next()">下一页</a>      </div>