关于分页功能的实现（Python）

实现客户端分页显示数据，客户端可选择每页显示几条数据（利用cookie），可实现上一页，下一页以及跳转到第几页。

服务器端：

views.py:

current_page = request.GET.get('p',1)#获取页码
current_page = int(current_page)
page_per_num = request.COOKIES.get('per_size',10)#获取每页显示的页码数量
page_per_num = int(page_per_num)

tatol_data = models.Classes.objects.all().count()#计算总页数
v,a = divmod(tatol_data,page_per_num)
if a:
    v+=1

if v<page_per_num+1:# 计算当前页显示的页码的起始，总页数小于每页要显示的数据个数
    start = 1
    end = v+1
else:
    if current_page<int((page_per_num+1)/2)://限制页码的首端
        start = 1
        end = page_per_num+1+1
    else:
        if current_page+int(page_per_num/2)+1>v://限制页码的尾端
            start = v-page_per_num
            end = v+1
        else:　　　　　　　　　　　　//正常情况
            start = current_page-int(page_per_num/2)
            end = current_page+int(page_per_num/2)+1

str =  ''#生产页码标签
if current_page==1://设置上一页
    str += '<a class="a1" href="javascript:void(0)">上一页</a>'
else:
    str+='<a class="a1" href="/app/Class/?p=%s">上一页</a>'%(current_page-1)
for i in range(start,end):
    if i == current_page:
         str=str+'<a class="a1 active" href="/app/Class/?p=%s">%s</a>'%(i,i)
    else:
        str = str+'<a class="a1" href="/app/Class/?p=%s">%s</a>'%(i,i)
if current_page==v://设置下一页
    str += '<a class="a1" href="#">下一页</a>'
else:
    str += '<a class="a1" href="/app/Class/?p=%s">下一页</a>' % (current_page + 1)
//设置跳转页码
jumps = ''' <input type='text'/><a onclick='jump(this,"/app/Class/?p=");'>Go</a>
             <script>
                 function jump(ths,base){
                      var v=ths.previousSibling.value;
                      if(v<=%s&&v>=1)
                         location.href = base+v;
                    }
                </script>
            ''' % v
str+=jumps
page_current_start = (current_page-1)*page_per_num#计算当前页显示的数据起始
page_current_end = (current_page)*page_per_num
class_list = models.Classes.objects.all()[page_current_start:page_current_end]

return render(request, 'class.html', {'username': username,'class_list':class_list,'str':str})

客户端:

<p>页码：</p>
{{ str|safe }}//设置按代码显示
 <div>
     <select id="p" onchange="changePageSize(this);">//选择每页显示的数据数量
         <option value="10">10</option>
         <option value="20">20</option>
         <option value="30">30</option>
         <option value="50">50</option>
         <option value="100">100</option>
     </select>
 </div>

<script src="/static/jquery-1.12.4.js"></script>
<script src="/static/jquery.cookie.js"></script>//使用jQuery.cookie操作cookie
    <script>
        $(function () {//页面加载完成自动选中select框的value值
            v = $.cookie('per_size');
            $('#p').val(v);
        });
        function changePageSize(ths) {//客户端选择后，设置cookie并刷新页面
            value = $(ths).val();
            $.cookie('per_size',value);
            location.reload();
        }
    </script>
效果图：