一、后端代码示例
这是自定义好的的分页器类，在写view代码的时候需要将其导入并实例化
1 class Pagination(object): 2 3 def __init__(self,current_page_num,all_count,request,per_page_num=2,pager_count=11): 4 """ 5 封装分页相关数据 6 :param current_page_num: 当前访问页的数字 7 :param all_count: 分页数据中的数据总条数 8 :param per_page_num: 每页显示的数据条数 9 :param pager_count: 最多显示的页码个数 10 """ 11 try: 12 current_page_num = int(current_page_num) 13 except Exception as e: 14 current_page_num = 1 15 16 if current_page_num <1: 17 current_page_num = 1 18 19 self.current_page_num = current_page_num 20 21 self.all_count = all_count 22 self.per_page_num = per_page_num 23 24 # 实际总页码 25 all_pager, tmp = divmod(all_count, per_page_num) 26 if tmp: 27 all_pager += 1 28 self.all_pager = all_pager 29 30 31 self.pager_count = pager_count 32 self.pager_count_half = int((pager_count - 1) / 2) # 5 33 34 35 # 保存搜索条件 36 37 import copy 38 self.params=copy.deepcopy(request.GET) # {"a":"1","b":"2"} 39 40 @property 41 def start(self): 42 return (self.current_page_num - 1) * self.per_page_num 43 44 @property 45 def end(self): 46 return self.current_page_num * self.per_page_num 47 48 def page_html(self): 49 # 如果总页码 < 11个： 50 if self.all_pager <= self.pager_count: 51 pager_start = 1 52 pager_end = self.all_pager + 1 53 # 总页码 > 11 54 else: 55 # 当前页如果<=页面上最多显示11/2个页码 56 if self.current_page_num <= self.pager_count_half: 57 pager_start = 1 58 pager_end = self.pager_count + 1 59 # 当前页大于5 60 else: 61 # 页码翻到最后 62 if (self.current_page_num + self.pager_count_half) > self.all_pager: 63 64 pager_start = self.all_pager - self.pager_count + 1 65 pager_end = self.all_pager + 1 66 67 else: 68 pager_start = self.current_page_num - self.pager_count_half 69 pager_end = self.current_page_num + self.pager_count_half + 1 70 71 page_html_list = [] 72 73 first_page = '<li><a href="?page=%s">首页</a></li>' % (1,) 74 page_html_list.append(first_page) 75 76 if self.current_page_num <= 1: 77 prev_page = '<li class="disabled"><a href="#">上一页</a></li>' 78 else: 79 prev_page = '<li><a href="?page=%s">上一页</a></li>' % (self.current_page_num - 1,) 80 81 page_html_list.append(prev_page) 82 83 84 #self.params=copy.deepcopy(request.GET) # {"a":"1","b":"2"} 85 86 for i in range(pager_start, pager_end): 87 88 self.params["page"]=i 89 90 if i == self.current_page_num: 91 temp = '<li class="active"><a href="?%s">%s</a></li>' %(self.params.urlencode(),i) 92 else: 93 temp = '<li><a href="?%s">%s</a></li>' % (self.params.urlencode(),i,) 94 page_html_list.append(temp) 95 96 97 98 if self.current_page_num >= self.all_pager: 99 next_page = '<li class="disabled"><a href="#">下一页</a></li>' 100 else: 101 next_page = '<li><a href="?page=%s">下一页</a></li>' % (self.current_page_num + 1,) 102 page_html_list.append(next_page) 103 last_page = '<li><a href="?page=%s">尾页</a></li>' % (self.all_pager,) 104 page_html_list.append(last_page) 105 106 return ''.join(page_html_list)
在指定的位置导入分页器类，如：
1 from Pagedemo.page import Pagination 2 current_page_num = request.GET.get("page"，1) #获取前端的页码，默认为1 3 book_list = Book.objects.all() # 查询后端要分页显示的数据 4 5 #实例化一个pagination对象 6 pagination=Pagination(current_page_num,book_list.count(),request) 7 8 9 10 book_list=book_list[pagination.start:pagination.end] 11 12 return render(request,"index.html",locals())
二、前端代码示例
布局样式参照bootstrap
1 <!DOCTYPE html> 2 <html lang="zh-CN"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Title</title> 6 <meta name="viewport" content="width=device-width, initial-scale=1"> 7 <!-- 最新版本的 Bootstrap 核心 CSS 文件 --> 8 <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 9 </head> 10 <body> 11 12 <ul> 13 {% for book in book_list %} 14 <li>{{ book.title }} ---- {{ book.price }}</li> 15 {% endfor %} 16 </ul> 17 18 <nav aria-label="Page navigation"> 19 <ul class="pagination"> 20 {{ pagination.page_html|safe }}...... 21 </ul> 22 </nav> 23 24 25 </body> 26 </html>