zoukankan      html  css  js  c++  java
  • jQuery客户端分页

    01 <script src="/js/jquery-1.4.1.js" type="text/javascript"></script>
    02    <script type="text/javascript">
    03        var pageindex = 1;
    04        var pagesize = 2;
    05        $(function () {
    06            previous();
    07        })
    08        function previous() {
    09            if (pageindex < 1 || pageindex == 1) {
    10                pageindex = 1;
    11                $("#imgdiv img:lt(" + pagesize + ")").show();
    12                $("#imgdiv img").not($("#imgdiv img:lt(" + pagesize + ")")).hide();
    13            }
    14            else {
    15                pageindex--;
    16                if (pageindex != 1) {
    17                    $("#imgdiv img:gt(" + ((pageindex - 1) * pagesize - 1) + "):lt("+ pagesize + ")").show();
    18                    $("#imgdiv img").not($("#imgdiv img:gt("+ ((pageindex - 1) * pagesize - 1) + "):lt(" + pagesize + ")")).hide();
    19                }
    20                if (pageindex == 1) {
    21                    $("#imgdiv img:lt(" + pagesize + ")").show();
    22                    $("#imgdiv img").not($("#imgdiv img:lt(" + pagesize + ")")).hide();
    23                }
    24            }
    25        }
    26        function next() {
    27            var p = $("#imgdiv img").length / pagesize;
    28  
    29            var pagecount = parseInt(Math.ceil(p));
    30  
    31            if (pageindex + 1 > pagecount) {
    32                pageindex = pagecount;
    33            } else {
    34                pageindex++;
    35            }
    36            $("#imgdiv img:gt(" + ((pageindex - 1) * pagesize - 1) + "):lt("+ pagesize + ")").show();
    37            $("#imgdiv img").not($("#imgdiv img:gt("+ ((pageindex - 1) * pagesize - 1) + "):lt(" + pagesize + ")")).hide();
    38        }
    39    </script>
    40 <div>
    41        <a href="javascript:previous()">上一页</a>
    42        <div id="imgdiv">
    43            <img src="/images/001.jpg" alt="第一页的第一张"/>
    44            <img src="/images/002.jpg" />
    45            <img src="/images/003.jpg" />
    46            <img src="/images/004.jpg" />
    47            <img src="/images/005.jpg"/>
    48        </div>
    49        <a href="javascript:next()">下一页</a>
    50    </div>
  • 相关阅读:
    WMI远程添加修改用户
    C#中利用mediaplayer打造mp3播放器
    使用BackgroundWorker 实现文件下载、异步提示
    asp.net 修改图片的分辨率,修改图片的长宽象素比例,修改图片的物理宽度大小
    修改注册表,让组策略对管理员无效
    一款支持CHM格式的安卓阅读器:ireader
    一款超好用的PDF阅读器:智器阅读
    C#基础温习(8):命名空间介绍
    书籍推荐:《职场潜伏心理学:全世界最权威的88个心理学定律》
    C#基础温习(10):C#实现托盘功能
  • 原文地址:https://www.cnblogs.com/xiaochao12345/p/3668252.html
Copyright © 2011-2022 走看看