工作笔记——分页控件

/**
     * @Author Mona
     * @Date 2016-11-07
     * @param selector {string} 当前要渲染的分页控件的容器
     * @param totalPage {int} 总页数
     * @param renderDataCallBack 分页回调函数,按照当前的分页去获取数据
     * @return 当前分页对象
     */

    function PageBar(selector,totalPage,renderDataCallBack){
        var _this = this;
        _this.selector = selector;
        _this.totalPage = totalPage;
        _this.renderDataCallBack = renderDataCallBack;
        _this._init();
    }

    PageBar.prototype = {
        _init:function(){
            var _this = this;
            _this._renderBar(1,1);
        },
        _renderBar:function(start,curPageNo){
            var _this = this;
            var $ul=$("<ul></ul>")
            for(var i=0;i<6;i++){
                if(i+start<=_this.totalPage){
                    var $li=$('<li>'+(i+start)+'</li>');
                    if(i+start==curPageNo)
                    {
                        $li.addClass('active');
                    }
                    $li.click(function(){
                        _this.liClick(this);
                    });
                    $ul.append($li);
                }
            }
            $('#pageBar').empty().append($ul);
        },
        liClick:function(li){
            var _this = this;
            var curPageNo = parseInt($(li).text());
            if($(li).index()==0&&curPageNo!==1)
            {
                var start1 = curPageNo-6+1;
                _this._renderBar(start1,curPageNo);
            }
            else if($(li).index()==6-1&&curPageNo<_this.totalPage)
            {
                _this._renderBar(curPageNo,curPageNo);
            }
            else {
                $(li).addClass('active').siblings().removeClass('active');
            }

            _this.renderDataCallBack(curPageNo);
        }

    }

   /* function callback(curPageNo){
        $.ajax({
            type:'post',
            data:{pageNo:curPageNo},
            success:function(data){
                
            }
        })
    }

    new PageBar('#pageBar',33,callback);*/

  

转载于:https://www.cnblogs.com/MonaSong/p/6037829.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值