后台:
分页工具类:
class PageHelper: def __init__(self): pass def getStart(self,current_page,pre_page=10): return (current_page - 1) * pre_page def getEnd(self,current_page,pre_page=10): return current_page*pre_page # pre_page:每页显示的记录数 def page_str(self,toal_count,current_page,base_url,pre_page=10): # 每页显示10条数据 # divmod 方法返回两个值一个是商,一个是余数 v, a = divmod(toal_count, pre_page) if a != 0: v += 1 pager_list = [] if current_page > 1: pager_list.append('<a href = "%s?p=%s" >上一页</a>' % (base_url,current_page - 1)) # 总页数<=11 # page_start=1 # page_end= 总页数 # # 总页数 > 11 # 当前页<6 # page_start=1 # page_end=11 # else # page_start = 当前页 -5 # page_end = 当前页 + 6 # if page_end> 总页数 # page_end = 总页数 # # if v <= 11: page_start = 1 page_end = v + 1 else: if current_page < 6: page_start = 1 page_end = 12 else: page_start = current_page - 5 page_end = current_page + 6 if page_end > v: page_start = v - 10 page_end = v + 1 for i in range(page_start, page_end): # 为当前页设置class,让用户可以知道当前是第几页 if i == current_page: pager_list.append('<a class="active" href = "%s?p=%s" >%s</a>' % (base_url,i, i)) else: pager_list.append('<a href = "%s?p=%s" >%s</a>' % (base_url,i, i)) # pager = ''' # <a href="classes.html?p=1">1</a> # <a href="classes.html?p=2">2</a> # <a href="classes.html?p=3">3</a> # ''' if current_page < v: pager_list.append('<a href = "%s?p=%s" >下一页</a>' % (base_url,current_page + 1)) pager = "".join(pager_list) return pager
调用分页类:
def handle_classes(req): if req.method == "GET": current_user = req.session.get('username') # 获取当前页,p的值默认是1 current_page = req.GET.get('p',1) current_page = int(current_page) pre_page = 5 #获取数据库中记录总数 toal_count = models.Classes.objects.all().count() obj = PageHelper() start =obj.getStart(current_page,pre_page) end = obj.getEnd(current_page,pre_page) #获取班级列表 cls_list = models.Classes.objects.all()[start:end] pager = obj.page_str(toal_count,current_page,'classes.html',pre_page) #返回到前端 #Django有防止xss攻击的机制,mark_safe() 表示取消xss 攻击,让pager 中的内容显示成正常的html标签 #第二种方式是在前端加{{str_pager|safe}} return render(req,'classes.html', {'username':current_user, 'cls_list':cls_list, 'str_pager':mark_safe(pager) })
前端
html
<div class="pageination"> {{str_pager}} </div>
css
.pageination a{ display: inline-block; padding: 5px; } .pageination a.active{ background-color: gold; color: red; }