在django开发过程中，实现前端页面的分页是一个基本且常用的功能！下面就同小编一起完成分页功能的实现及封装与调用。
小编默认看客朋友们都会创建，故不在赘述，若不熟悉，猛戳这里！
create database pagination;
import os
# Build paths inside the project like this: os.path.join(BASE_DIR, ...)
BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))
# Quick-start development settings - unsuitable for production
# See https://docs.djangoproject.com/en/1.11/howto/deployment/checklist/
# SECURITY WARNING: keep the secret key used in production secret!
SECRET_KEY = 'fp5b9^gk)l_+mgoh=0&%4o#m3c1ezj5274k$hu3n@sdn!ab!f='
# SECURITY WARNING: don't run with debug turned on in production!
DEBUG = True
ALLOWED_HOSTS = ['*', ]
# Application definition
INSTALLED_APPS = [
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
'app01.apps.App01Config',
]
MIDDLEWARE = [
'django.middleware.security.SecurityMiddleware',
'django.contrib.sessions.middleware.SessionMiddleware',
'django.middleware.common.CommonMiddleware',
'django.middleware.csrf.CsrfViewMiddleware',
'django.contrib.auth.middleware.AuthenticationMiddleware',
'django.contrib.messages.middleware.MessageMiddleware',
'django.middleware.clickjacking.XFrameOptionsMiddleware',
]
ROOT_URLCONF = 'pagination.urls'
TEMPLATES = [
{
'BACKEND': 'django.template.backends.django.DjangoTemplates',
'DIRS': [os.path.join(BASE_DIR, 'templates')]
,
'APP_DIRS': True,
'OPTIONS': {
'context_processors': [
'django.template.context_processors.debug',
'django.template.context_processors.request',
'django.contrib.auth.context_processors.auth',
'django.contrib.messages.context_processors.messages',
],
},
},
]
WSGI_APPLICATION = 'pagination.wsgi.application'
# Database
# https://docs.djangoproject.com/en/1.11/ref/settings/#databases
DATABASES = {
'default': {
# 'ENGINE': 'django.db.backends.sqlite3',
# 'NAME': os.path.join(BASE_DIR, 'db.sqlite3'),
'ENGINE': 'django.db.backends.mysql',
'NAME': 'pagination',
'HOST': '127.0.0.1',
'PORT': '3306',
'USER': 'root',
'PASSWORD': '201314',
}
}
# Password validation
# https://docs.djangoproject.com/en/1.11/ref/settings/#auth-password-validators
AUTH_PASSWORD_VALIDATORS = [
{
'NAME': 'django.contrib.auth.password_validation.UserAttributeSimilarityValidator',
},
{
'NAME': 'django.contrib.auth.password_validation.MinimumLengthValidator',
},
{
'NAME': 'django.contrib.auth.password_validation.CommonPasswordValidator',
},
{
'NAME': 'django.contrib.auth.password_validation.NumericPasswordValidator',
},
]
# Internationalization
# https://docs.djangoproject.com/en/1.11/topics/i18n/
# LANGUAGE_CODE = 'en-us'
LANGUAGE_CODE = 'zh-hans'
# TIME_ZONE = 'UTC'
TIME_ZONE = 'Asia/shanghai'
USE_I18N = True
# USE_L10N = True
USE_L10N = False
USE_TZ = True
DATETIME_FORMAT = 'Y-m-d H:i:s'
# Static files (CSS, JavaScript, Images)
# https://docs.djangoproject.com/en/1.11/howto/static-files/
STATIC_URL = '/static/'
STATICFILES_DIRS = [
os.path.join(BASE_DIR, 'static')
]
models.py文件
from django.db import models
# Create your models here.
class Joke(models.Model):
create_time = models.DateTimeField(auto_now_add=True, verbose_name='创建时间')
content = models.CharField(max_length=512, verbose_name='内容')
在pycharm的Terminal中分别执行以下两条命令，进行数据库的迁移
python manage.py makemigrations # 生成迁移文件
python manage.py migrate # 迁移到数据库
小编习惯使用Navicat连接数据库，也可以使用pycharm专业版自带的可视化工具进行连接(若不熟悉，猛戳这里)！
5–>为添加数据，6–>刷新到数据库
1， urls.py
from django.conf.urls import url
from django.contrib import admin
from app01 import views
urlpatterns = [
url(r'^admin/', admin.site.urls),
url(r'^home/', views.home, name='home'),
]
2，views.py
from django.shortcuts import render
from app01 import models
from custom.paging import Paging
# Create your views here.
def home(request):
all_jokes = models.Joke.objects.all()
return render(request, 'home.html', locals())
3,在templates下创建home.html文件
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>个人博客模板</title>
<meta name="keywords" content="个人博客模板"/>
<meta name="description" content="个人博客模板"/>
{% load static %}
<link href="{% static 'home/css/styles.css' %}" rel="stylesheet">
<link rel="stylesheet" href="{% static 'css/bootstrap.min.css' %}">
</head>
<body>
<header>
<nav id="nav">
<ul>
<li><a href="#">网站首页</a></li>
<li><a href="#">模板</a></li>
<li><a href="#">关于我们</a></li>
<li><a href="#">我们的故事</a></li>
<li><a href="#">我们的蜜月</a></li>
<li><a href="#">婚礼现场</a></li>
<li><a href="#">婚纱摄影</a></li>
<li><a href="#">我们的博客</a></li>
<li><a href="#">联系我们</a></li>
</ul>
<script src="{% static 'home/js/silder.js' %}"></script><!--获取当前页导航 高亮显示标题-->
</nav>
</header>
<div class="mainContent">
<aside>
<div class="avatar">
<a href="#"><span>爱笑的眼睛</span></a>
</div>
<section class="topspaceinfo">
<h1>执子之手，与子偕老</h1>
<p>于千万人之中，我遇见了我所遇见的人....</p>
</section>
<div class="userinfo">
<p class="q-fans"> 粉丝：<a href="#">520</a></p>
<p class="btns"><a href="#">私信</a><a href="#">相册</a><a href="#">存档</a></p>
</div>
<section class="newpic">
<h2>最新照片</h2>
<ul>
<li><a href="#"><img src="{% static 'home/images/01.jpg' %}"></a></li>
<li><a href="#"><img src="{% static 'home/images/02.jpg' %}"></a></li>
<li><a href="#"><img src="{% static 'home/images/03.jpg' %}"></a></li>
<li><a href="#"><img src="{% static 'home/images/04.jpg' %}"></a></li>
<li><a href="#"><img src="{% static 'home/images/05.jpg' %}"></a></li>
<li><a href="#"><img src="{% static 'home/images/06.jpg' %}"></a></li>
<li><a href="#"><img src="{% static 'home/images/07.jpg' %}"></a></li>
<li><a href="#"><img src="{% static 'home/images/08.jpg' %}"></a></li>
</ul>
</section>
<section class="taglist">
<h2>全部标签</h2>
<ul>
<li><a href="#">青空</a></li>
<li><a href="#">情感聊吧</a></li>
<li><a href="#">study</a></li>
<li><a href="#">青青唠叨</a></li>
</ul>
</section>
</aside>
<div class="blogitem">
{% for joke in all_jokes %}
<article>
<h2 class="title"><a href="#">笑话>>{{ forloop.counter }}</a></h2>
<ul class="text">
<p>上传时间：{{ joke.create_time }}</p>
<p class="textimg"><img src="{% static 'home/images/001.gif' %}"></p>
<p>{{ joke.content }}</p>
</ul>
<div class="textfoot">
<a href="#">阅读全文</a><a href="#">评论</a><a href="#">转载</a>
</div>
</article>
{% endfor %}
</div>
</div>
<footer>
<div class="footavatar">
<img src="{% static 'home/images/0003.jpg' %}" class="footphoto">
<ul class="footinfo">
<p class="fname"><a href="/dancesmile">爱笑的眼睛</a></p>
<p class="finfo">性别：男 年龄：18岁</p>
<p>现居：陕西西安</p></ul>
</div>
<section class="visitor">
<h2>最近访客</h2>
<ul>
<li><a href="#"><img src="{% static 'home/images/s0.jpg' %}"></a></li>
<li><a href="#"><img src="{% static 'home/images/s1.jpg' %}"></a></li>
<li><a href="#"><img src="{% static 'home/images/s2.jpg' %}"></a></li>
<li><a href="#"><img src="{% static 'home/images/s3.jpg' %}"></a></li>
<li><a href="#"><img src="{% static 'home/images/s5.jpg' %}"></a></li>
<li><a href="#"><img src="{% static 'home/images/s6.jpg' %}"></a></li>
<li><a href="#"><img src="{% static 'home/images/s7.jpg' %}"></a></li>
<li><a href="#"><img src="{% static 'home/images/s8.jpg' %}"></a></li>
</ul>
</section>
<div class="Copyright">
<ul>
<a href="#">帮助中心</a><a href="#">空间客服</a><a href="#">投诉中心</a><a href="#">空间协议</a>
</ul>
<p>Design by DanceSmile</p>
</div>
</footer>
</body>
</html>
启动项目看一下效果
姑且将此分页功能放下，咱们先实验一个小例子，一会调用！
1，urls.py
from django.conf.urls import url
from django.contrib import admin
from app01 import views
urlpatterns = [
url(r'^admin/', admin.site.urls),
url(r'^home/', views.home, name='home'),
url(r'^paging/', views.paging, name='paging'),
]
2，views.py
from django.shortcuts import render
from app01 import models
from custom.paging import Paging
# Create your views here.
def home(request):
all_jokes = models.Joke.objects.all()
return render(request, 'home.html', locals())
user_list = [{'user': 'hpl-%s' % i, 'pwd': '201314-%s%s' % (i + 1, i + 3)} for i in range(1, 358)]
def paging(request):
return render(request, 'paging.html', {'user_list': user_list})
3,在templates下创建paging.html文件
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
{% load static %}
<link rel="stylesheet" href="{% static 'css/bootstrap.min.css' %}">
</head>
<body>
<div style="width: 800px;margin: 0 auto;font-size: 17px">
<table class="table table-hover table-bordered">
<thead>
<tr>
<th>序号</th>
<th>用户名</th>
<th>密码</th>
</tr>
</thead>
<tbody>
{% for user in user_list %}
<tr>
<td>{{ forloop.counter }}</td>
<td>{{ user.user }}</td>
<td>{{ user.pwd }}</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
</body>
</html>
记得在static文件夹下放置bootstrap的css文件
运行结果如下
4，实现分页功能
分页功能既可以放在前端，也可以放在后端。但是如果数据量比较大，放在前端就显得不太好，所以咱们将分页功能写在后端！
（1）首先进行异常处理，如直接输入url为…/?page=-3或…/?page=asdf等对错误的处理
def paging(request):
try:
# 获取url中的page值，并将默认值设置为1
page = int(request.GET.get('page', 1))
print(page, type(page))
if page < 1:
page = 1
except Exception:
page = 1
print(page)
return render(request, 'paging.html', {'user_list': user_list})
（2）对起始和终止进行固定切片
def paging(request):
try:
# 获取url中的page值，并将默认值设置为1
page = int(request.GET.get('page', 1))
# print(page, type(page))
if page < 1:
page = 1
except Exception:
page = 1
# print(page)
# 起始
start = 0
# 终止
end = 7
return render(request, 'paging.html', {'user_list': user_list[start: end]})
（3）对起始和终止进行灵活切片
def paging(request):
try:
# 获取url中的page值，并将默认值设置为1
page = int(request.GET.get('page', 1))
# print(page, type(page))
if page < 1:
page = 1
except Exception:
page = 1
# print(page)
# 每页显示的数量
page_num = 7
# 起始
# start = 0
start = (page - 1) * page_num
# 终止
# end = 7
end = page * page_num
return render(request, 'paging.html', {'user_list': user_list[start: end]})
实际上至此，分页的功能已经基本实现！对于开发者人员懂得直接在url上进行更改，但是对于普通用户使用，便显得并不是十分的友好！
（4）拿取bootstrap的分页功能代码
将此代码拿下来，放在咱们的paging.html中
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
{% load static %}
<link rel="stylesheet" href="{% static 'css/bootstrap.min.css' %}">
</head>
<body>
<div style="width: 800px;margin: 0 auto;font-size: 17px">
<table class="table table-hover table-bordered">
<thead>
<tr>
<th>序号</th>
<th>用户名</th>
<th>密码</th>
</tr>
</thead>
<tbody>
{% for user in user_list %}
<tr>
<td>{{ forloop.counter }}</td>
<td>{{ user.user }}</td>
<td>{{ user.pwd }}</td>
</tr>
{% endfor %}
</tbody>
</table>
<nav aria-label="Page navigation">
<ul class="pagination pagination-lg">
<li><a href="#" aria-label="Previous">
<span aria-hidden="true">«</span>
</a>
</li>
<li><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li><a href="#">5</a></li>
<li>
<a href="#" aria-label="Next">
<span aria-hidden="true">»</span>
</a>
</li>
</ul>
</nav>
</div>
</body>
</html>
（5）计算总页码数
view.py中
def paging(request):
try:
# 获取url中的page值，并将默认值设置为1
page = int(request.GET.get('page', 1))
# print(page, type(page))
if page < 1:
page = 1
except Exception:
page = 1
# print(page)
# 每页显示的数量
page_num = 7
# 计算总页码数
# divmod为len(user_list) / page_num，整数为total_num，余数为remainder
total_num, remainder = divmod(len(user_list), page_num)
if remainder != 0:
total_num += 1
# print(total_num)
# 起始
# start = 0
start = (page - 1) * page_num
# 终止
# end = 7
end = page * page_num
return render(request, 'paging.html', {'user_list': user_list[start: end], 'total_num': range(1, total_num + 1)})
paging.html中
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
{% load static %}
<link rel="stylesheet" href="{% static 'css/bootstrap.min.css' %}">
</head>
<body>
<div style="width: 800px;margin: 0 auto;font-size: 17px">
<table class="table table-hover table-bordered">
<thead>
<tr>
<th>序号</th>
<th>用户名</th>
<th>密码</th>
</tr>
</thead>
<tbody>
{% for user in user_list %}
<tr>
<td>{{ forloop.counter }}</td>
<td>{{ user.user }}</td>
<td>{{ user.pwd }}</td>
</tr>
{% endfor %}
</tbody>
</table>
<nav aria-label="Page navigation">
<ul class="pagination pagination-lg">
<li><a href="#" aria-label="Previous">
<span aria-hidden="true">«</span>
</a>
</li>
{% for num in total_num %}
<li><a href="?page={{ num }}">{{ num }}</a></li>
{% endfor %}
<li>
<a href="#" aria-label="Next">
<span aria-hidden="true">»</span>
</a>
</li>
</ul>
</nav>
</div>
</body>
</html>
运行效果为
（6）页面要显示的页码数
view.py中
def paging(request):
global page_end, page_start
try:
# 获取url中的page值，并将默认值设置为1
page = int(request.GET.get('page', 1))
# print(page, type(page))
if page < 1:
page = 1
except Exception:
page = 1
# print(page)
# 每页显示的数量
page_num = 7
# 计算总页码数
# divmod为len(user_list) / page_num，整数为total_num，余数为remainder
total_num, remainder = divmod(len(user_list), page_num)
if remainder != 0:
total_num += 1
# print(total_num)
# 页码起始值
page_start = 1
# 页码终止值
page_end = 7
# 起始
# start = 0
start = (page - 1) * page_num
# 终止
# end = 7
end = page * page_num
return render(request, 'paging.html',
{'user_list': user_list[start: end], 'total_num': range(page_start, page_end + 1)})
运行效果为
（7）处理实际总页码数小于页面总页码数 和 实际总页码数大于页面总页码数情况
view.py中
def paging(request):
try:
# 获取url中的page值，并将默认值设置为1
page = int(request.GET.get('page', 1))
# print(page, type(page))
if page < 1:
page = 1
except Exception:
page = 1
# print(page)
# 每页显示的数量
page_num = 7
# 计算总页码数
# divmod为len(user_list) / page_num，整数为total_num，余数为remainder
total_num, remainder = divmod(len(user_list), page_num)
if remainder != 0:
total_num += 1
# print(total_num)
# 每页显示的总页码数
max_page_num = 7
# 每页显示总页码数一半数
half_num = max_page_num // 2
# 实际总页码数 < 页面总页码数
if total_num < max_page_num:
# 页码起始值
page_start = 1
# 页码终止值
page_end = total_num
# 实际总页码数 > 页面总页码数
else:
page_start = page - half_num
page_end = page + half_num
# 起始
# start = 0
start = (page - 1) * page_num
# 终止
# end = 7
end = page * page_num
return render(request, 'paging.html',
{'user_list': user_list[start: end], 'total_num': range(page_start, page_end + 1)})
（8）处理两边极值情况
view.py中
def paging(request):
try:
# 获取url中的page值，并将默认值设置为1
page = int(request.GET.get('page', 1))
# print(page, type(page))
if page < 1:
page = 1
except Exception:
page = 1
# print(page)
# 每页显示的数量
page_num = 7
# 计算总页码数
# divmod为len(user_list) / page_num，整数为total_num，余数为remainder
total_num, remainder = divmod(len(user_list), page_num)
if remainder != 0:
total_num += 1
# print(total_num)
# 每页显示的总页码数
max_page_num = 7
# 每页显示总页码数一半数
half_num = max_page_num // 2
# 实际总页码数 < 页面总页码数
if total_num < max_page_num:
# 页码起始值
page_start = 1
# 页码终止值
page_end = total_num
# 实际总页码数 > 页面总页码数
else:
# 处理左边极值
if page - half_num < 1:
page_start = 1
page_end = max_page_num
# 处理右边极值
elif page + half_num > total_num:
page_start = total_num - max_page_num + 1
page_end = total_num
else:
page_start = page - half_num
page_end = page + half_num
# 起始
# start = 0
start = (page - 1) * page_num
# 终止
# end = 7
end = page * page_num
return render(request, 'paging.html',
{'user_list': user_list[start: end], 'total_num': range(page_start, page_end + 1)})
运行效果为
（9）将paging.html中的页码循环放到后端
paging.html中
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
{% load static %}
<link rel="stylesheet" href="{% static 'css/bootstrap.min.css' %}">
</head>
<body>
<div style="width: 800px;margin: 0 auto;font-size: 17px">
<table class="table table-hover table-bordered">
<thead>
<tr>
<th>序号</th>
<th>用户名</th>
<th>密码</th>
</tr>
</thead>
<tbody>
{% for user in user_list %}
<tr>
<td>{{ forloop.counter }}</td>
<td>{{ user.user }}</td>
<td>{{ user.pwd }}</td>
</tr>
{% endfor %}
</tbody>
</table>
<nav aria-label="Page navigation">
<ul class="pagination pagination-lg">
<li><a href="#" aria-label="Previous">
<span aria-hidden="true">«</span>
</a>
</li>
{{ html_list|safe }}
<li>
<a href="#" aria-label="Next">
<span aria-hidden="true">»</span>
</a>
</li>
</ul>
</nav>
</div>
</body>
</html>
view.py中
def paging(request):
try:
# 获取url中的page值，并将默认值设置为1
page = int(request.GET.get('page', 1))
# print(page, type(page))
if page < 1:
page = 1
except Exception:
page = 1
# print(page)
# 每页显示的数量
page_num = 7
# 计算总页码数
# divmod为len(user_list) / page_num，整数为total_num，余数为remainder
total_num, remainder = divmod(len(user_list), page_num)
if remainder != 0:
total_num += 1
# print(total_num)
# 每页显示的总页码数
max_page_num = 7
# 每页显示总页码数一半数
half_num = max_page_num // 2
# 实际总页码数 < 页面总页码数
if total_num < max_page_num:
# 页码起始值
page_start = 1
# 页码终止值
page_end = total_num
# 实际总页码数 > 页面总页码数
else:
# 处理左边极值
if page - half_num < 1:
page_start = 1
page_end = max_page_num
# 处理右边极值
elif page + half_num > total_num:
page_start = total_num - max_page_num + 1
page_end = total_num
else:
page_start = page - half_num
page_end = page + half_num
html_list = []
for i in range(page_start, page_end + 1):
html_list.append('<li><a href="?page=%s">%s</a></li>' % (i, i))
html_list = ''.join(html_list)
# 起始
# start = 0
start = (page - 1) * page_num
# 终止
# end = 7
end = page * page_num
return render(request, 'paging.html',
{'user_list': user_list[start: end], 'html_list': html_list})
（10）基于Bootstrap给当前页加上颜色显示
view.py中
def paging(request):
try:
# 获取url中的page值，并将默认值设置为1
page = int(request.GET.get('page', 1))
# print(page, type(page))
if page < 1:
page = 1
except Exception:
page = 1
# print(page)
# 每页显示的数量
page_num = 7
# 计算总页码数
# divmod为len(user_list) / page_num，整数为total_num，余数为remainder
total_num, remainder = divmod(len(user_list), page_num)
if remainder != 0:
total_num += 1
# print(total_num)
# 每页显示的总页码数
max_page_num = 7
# 每页显示总页码数一半数
half_num = max_page_num // 2
# 实际总页码数 < 页面总页码数
if total_num < max_page_num:
# 页码起始值
page_start = 1
# 页码终止值
page_end = total_num
# 实际总页码数 > 页面总页码数
else:
# 处理左边极值
if page - half_num < 1:
page_start = 1
page_end = max_page_num
# 处理右边极值
elif page + half_num > total_num:
page_start = total_num - max_page_num + 1
page_end = total_num
else:
page_start = page - half_num
page_end = page + half_num
html_list = []
for i in range(page_start, page_end + 1):
if page == i:
html_list.append('<li class="active"><a href="?page=%s">%s</a></li>' % (i, i))
else:
html_list.append('<li><a href="?page=%s">%s</a></li>' % (i, i))
html_list = ''.join(html_list)
# 起始
# start = 0
start = (page - 1) * page_num
# 终止
# end = 7
end = page * page_num
return render(request, 'paging.html',
{'user_list': user_list[start: end], 'html_list': html_list})
运行效果为
（11）实现上一页和下一页功能
paging,html中
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
{% load static %}
<link rel="stylesheet" href="{% static 'css/bootstrap.min.css' %}">
</head>
<body>
<div style="width: 800px;margin: 0 auto;font-size: 17px">
<table class="table table-hover table-bordered">
<thead>
<tr>
<th>序号</th>
<th>用户名</th>
<th>密码</th>
</tr>
</thead>
<tbody>
{% for user in user_list %}
<tr>
<td>{{ forloop.counter }}</td>
<td>{{ user.user }}</td>
<td>{{ user.pwd }}</td>
</tr>
{% endfor %}
</tbody>
</table>
<nav aria-label="Page navigation">
<ul class="pagination pagination-lg">
{{ html_list|safe }}
</ul>
</nav>
</div>
</body>
</html>
view.py
def paging(request):
try:
# 获取url中的page值，并将默认值设置为1
page = int(request.GET.get('page', 1))
# print(page, type(page))
if page < 1:
page = 1
except Exception:
page = 1
# print(page)
# 每页显示的数量
page_num = 7
# 计算总页码数
# divmod为len(user_list) / page_num，整数为total_num，余数为remainder
total_num, remainder = divmod(len(user_list), page_num)
if remainder != 0:
total_num += 1
# print(total_num)
# 每页显示的总页码数
max_page_num = 7
# 每页显示总页码数一半数
half_num = max_page_num // 2
# 实际总页码数 < 页面总页码数
if total_num < max_page_num:
# 页码起始值
page_start = 1
# 页码终止值
page_end = total_num
# 实际总页码数 > 页面总页码数
else:
# 处理左边极值
if page - half_num < 1:
page_start = 1
page_end = max_page_num
# 处理右边极值
elif page + half_num > total_num:
page_start = total_num - max_page_num + 1
page_end = total_num
else:
page_start = page - half_num
page_end = page + half_num
html_list = []
html_list.append(
'<li><a href="?page=%s" aria-label="Previous"><span aria-hidden="true">«</span></a></li>' % (page - 1))
for i in range(page_start, page_end + 1):
if page == i:
html_list.append('<li class="active"><a href="?page=%s">%s</a></li>' % (i, i))
else:
html_list.append('<li><a href="?page=%s">%s</a></li>' % (i, i))
html_list.append(
'<li><a href="?page=%s" aria-label="Next"><span aria-hidden="true">»</span></a></li>' % (page + 1))
html_list = ''.join(html_list)
# 起始
# start = 0
start = (page - 1) * page_num
# 终止
# end = 7
end = page * page_num
return render(request, 'paging.html',
{'user_list': user_list[start: end], 'html_list': html_list})
（12）两边到达极值后，上一页，下一页功能禁用
view.py中
def paging(request):
try:
# 获取url中的page值，并将默认值设置为1
page = int(request.GET.get('page', 1))
# print(page, type(page))
if page < 1:
page = 1
except Exception:
page = 1
# print(page)
# 每页显示的数量
page_num = 7
# 计算总页码数
# divmod为len(user_list) / page_num，整数为total_num，余数为remainder
total_num, remainder = divmod(len(user_list), page_num)
if remainder != 0:
total_num += 1
# print(total_num)
# 每页显示的总页码数
max_page_num = 7
# 每页显示总页码数一半数
half_num = max_page_num // 2
# 实际总页码数 < 页面总页码数
if total_num < max_page_num:
# 页码起始值
page_start = 1
# 页码终止值
page_end = total_num
# 实际总页码数 > 页面总页码数
else:
# 处理左边极值
if page - half_num < 1:
page_start = 1
page_end = max_page_num
# 处理右边极值
elif page + half_num > total_num:
page_start = total_num - max_page_num + 1
page_end = total_num
else:
page_start = page - half_num
page_end = page + half_num
html_list = []
if page == 1:
html_list.append(
'<li class="disabled"><a href="#" aria-label="Previous"><span aria-hidden="true">«</span></a></li>')
else:
html_list.append(
'<li><a href="?page=%s" aria-label="Previous"><span aria-hidden="true">«</span></a></li>' % (page - 1))
for i in range(page_start, page_end + 1):
if page == i:
html_list.append('<li class="active"><a href="?page=%s">%s</a></li>' % (i, i))
else:
html_list.append('<li><a href="?page=%s">%s</a></li>' % (i, i))
if page == total_num:
html_list.append(
'<li class="disabled"><a href="#" aria-label="Next"><span aria-hidden="true">»</span></a></li>')
else:
html_list.append(
'<li><a href="?page=%s" aria-label="Next"><span aria-hidden="true">»</span></a></li>' % (page + 1))
html_list = ''.join(html_list)
# 起始
# start = 0
start = (page - 1) * page_num
# 终止
# end = 7
end = page * page_num
return render(request, 'paging.html',
{'user_list': user_list[start: end], 'html_list': html_list})
（13）将前端分页代码全部移到后端，并进行分页功能的封装
view.py中
def paging(request):
try:
# 获取url中的page值，并将默认值设置为1
page = int(request.GET.get('page', 1))
# print(page, type(page))
if page < 1:
page = 1
except Exception:
page = 1
# print(page)
# 每页显示的数量
page_num = 7
# 计算总页码数
# divmod为len(user_list) / page_num，整数为total_num，余数为remainder
total_num, remainder = divmod(len(user_list), page_num)
if remainder != 0:
total_num += 1
# print(total_num)
# 每页显示的总页码数
max_page_num = 7
# 每页显示总页码数一半数
half_num = max_page_num // 2
# 实际总页码数 < 页面总页码数
if total_num < max_page_num:
# 页码起始值
page_start = 1
# 页码终止值
page_end = total_num
# 实际总页码数 > 页面总页码数
else:
# 处理左边极值
if page - half_num < 1:
page_start = 1
page_end = max_page_num
# 处理右边极值
elif page + half_num > total_num:
page_start = total_num - max_page_num + 1
page_end = total_num
else:
page_start = page - half_num
page_end = page + half_num
html_list = ['<nav aria-label="Page navigation"><ul class="pagination pagination-lg">']
if page == 1:
html_list.append(
'<li class="disabled"><a href="#" aria-label="Previous"><span aria-hidden="true">«</span></a></li>')
else:
html_list.append(
'<li><a href="?page=%s" aria-label="Previous"><span aria-hidden="true">«</span></a></li>' % (page - 1))
for i in range(page_start, page_end + 1):
if page == i:
html_list.append('<li class="active"><a href="?page=%s">%s</a></li>' % (i, i))
else:
html_list.append('<li><a href="?page=%s">%s</a></li>' % (i, i))
if page == total_num:
html_list.append(
'<li class="disabled"><a href="#" aria-label="Next"><span aria-hidden="true">»</span></a></li>')
else:
html_list.append(
'<li><a href="?page=%s" aria-label="Next"><span aria-hidden="true">»</span></a></li>' % (page + 1))
html_list.append('</ul></nav>')
html_list = ''.join(html_list)
# 起始
# start = 0
start = (page - 1) * page_num
# 终止
# end = 7
end = page * page_num
return render(request, 'paging.html',
{'user_list': user_list[start: end], 'html_list': html_list})
paging.html中
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
{% load static %}
<link rel="stylesheet" href="{% static 'css/bootstrap.min.css' %}">
</head>
<body>
<div style="width: 800px;margin: 0 auto;font-size: 17px">
<table class="table table-hover table-bordered">
<thead>
<tr>
<th>序号</th>
<th>用户名</th>
<th>密码</th>
</tr>
</thead>
<tbody>
{% for user in user_list %}
<tr>
<td>{{ forloop.counter }}</td>
<td>{{ user.user }}</td>
<td>{{ user.pwd }}</td>
</tr>
{% endfor %}
</tbody>
</table>
{{ html_list|safe }}
</div>
</body>
</html>
至此基于Bootstrap分页功能已经全部实现完成
下面咱们将其封装起来，方便以后调用
在django项目目录下新建一个文件夹(如小编这里的叫：costom)，在下面新建一个py文件(小编这里叫：paging.py)，两个名字可以自拟
在paging.py中定义一个类，在类里面定义一个init方法，类名可以自拟，并将刚才写好的分页功能代码复制到init下面
paging.py中
class Paging:
# page_num为每页显示的数量，max_page_num为每页显示的总页码数
def __init__(self, request, lengths, page_num=10, max_page_num=7):
# 首先进行异常错误处理，比如：.../?page=-5等
try:
# 获取url中的page值，并将默认值设置为1
page = int(request.GET.get('page', 1))
# print(page, type(page))
if page < 1:
page = 1
except Exception:
page = 1
# print(page)
# 每页显示的数量
# page_num = 7
# 计算总页码数
# divmod为len(user_list) / page_num，整数为total_num，余数为remainder
total_num, remainder = divmod(lengths, page_num)
if remainder != 0:
total_num += 1
# print(total_num)
# 每页显示的总页码数
# max_page_num = 7
# 每页显示总页码数一半数
half_num = max_page_num // 2
# 实际总页码数 < 页面总页码数
if total_num < max_page_num:
# 页码起始值
page_start = 1
# 页码终止值
page_end = total_num
# 实际总页码数 > 页面总页码数
else:
# 处理左边极值
if page - half_num < 1:
page_start = 1
page_end = max_page_num
# 处理右边极值
elif page + half_num > total_num:
page_start = total_num - max_page_num + 1
page_end = total_num
else:
page_start = page - half_num
page_end = page + half_num
html_list = ['<nav aria-label="Page navigation"><ul class="pagination pagination-lg">']
if page == 1:
html_list.append(
'<li class="disabled"><a href="#" aria-label="Previous"><span aria-hidden="true">«</span></a></li>')
else:
html_list.append(
'<li><a href="?page=%s" aria-label="Previous"><span aria-hidden="true">«</span></a></li>' % (
page - 1))
for i in range(page_start, page_end + 1):
if page == i:
html_list.append('<li class="active"><a href="?page=%s">%s</a></li>' % (i, i))
else:
html_list.append('<li><a href="?page=%s">%s</a></li>' % (i, i))
if page == total_num:
html_list.append(
'<li class="disabled"><a href="#" aria-label="Next"><span aria-hidden="true">»</span></a></li>')
else:
html_list.append(
'<li><a href="?page=%s" aria-label="Next"><span aria-hidden="true">»</span></a></li>' % (
page + 1))
html_list.append('</ul></nav>')
self.html_list = ''.join(html_list)
# 起始
# start = 0
self.start = (page - 1) * page_num
# 终止
# end = 7
self.end = page * page_num
# 要调用的值
"""
self.start
self.end
self.html_list
"""
（14）分页功能的调用
view.py中
from custom.paging import Paging
user_list = [{'user': 'hpl-%s' % i, 'pwd': '201314-%s%s' % (i + 1, i + 3)} for i in range(1, 358)]
def paging(request):
page = Paging(request, lengths=len(user_list), page_num=14, max_page_num=7)
return render(request, 'paging.html',
{'user_list': user_list[page.start: page.end], 'html_list': page.html_list})
运行功能