之前用django框架打了一个简易的博客网站,现在说说怎么用django做超链接。

本文基于之前讲解的博客应用,如果只想学超链接请自行删减代码或评论提问。

首先,在templates文件夹下添加details.html文件:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>{{ data.title }}</title>
</head>
<body>
<h2>{{ data.title }}</h2>
<img style="width: 450px;height: 300px;" src="{{ data.img }}">
</body>
</html>

然后,再添加menu.html文件:

<html lang="en">
<head>
<meta charset="UTF-8">
<title>Carton</title>
</head>
<body>
<ul>
{% for item in data %}
<li>
<a href="/details/{{ item.id }}">{{ item.title }}</a>
</li>
{% endfor %}
</ul>
</body>
</html>

切记,html文件不能有中文!!!不然UTF-8编码会出错,页面会显示UnicodeError。

然后就开始建立连接了:

先打开views.py;

from django.shortcuts import render,redirect,render_to_response
from blog.models import BlogsPost # Create your views here. def blog_index(request):
blog_list = BlogsPost.objects.all()
return render(request,'index.html', {'blog_list': blog_list}) def blog_school(request):
return redirect('https://www.dlmu.edu.cn/') def details_render(response, id):
data = {
"1": {"title": "one",
'img': 'http://photocdn.sohu.com/20140303/Img395937155.jpg'},
"2": {"title": "two",
'img': 'http://p4.so.qhmsg.com/sdr/400__/t01145220e19e14dd69.jpg'},
"3": {"title": "three",
'img': 'http://uploads.5068.com/allimg/1812/224-1Q21Q51239.jpg'},
"4": {"title": "four",
'img': 'http://www.chinaqw.com/zhwh/2016/09-06/U682P894T5D102134F42DT20160906113524.jpg'},
"5": {"title": "five",
'img': 'https://p1.ssl.qhmsg.com/t01409ee9dd99712d8c.jpg'}
}.get(id)
return render_to_response("details.html", locals()) def menu_list(request):
data = [
{"id": 1, "title": "The Chinese dream"},
{"id": 2, "title": "Core socialist values"},
{"id": 3, "title": "Reform and opening up"},
{"id": 4, "title": "The Belt and Road"},
{"id": 5, "title": "Dalian Maritime University"}
]
return render_to_response("menu.html", locals())

接下来添加URL:

打开urls.py:

from django.conf.urls import url
from django.urls import path,re_path
from django.contrib import admin
from blog import views urlpatterns = [
url('admin/', admin.site.urls),
url(r'^blog/$',views.blog_index,name='index'),
url(r'^school/$',views.blog_school),
path('menu_list/',views.menu_list),
re_path(r'details/(?P<id>\d{1,2})',views.details_render),
]

这是运行程序,输入 http://127.0.0.1:8000/menu_list 即可打开超链接。

最新文章

  1. [LINQ TO SQL]使用LINQ TO SQL创建数据库
  2. LL基本姿势
  3. Hibernate 继承映射
  4. 2016 08 27 印刷菜单增加sql语句
  5. Servlet的使用方法详细说明
  6. 《ASP.NET1200例》当前上下文中不存在名称configurationmanager
  7. C 和C++ 名称修饰规则
  8. IE浏览器部分版本不支持background-siza属性问题
  9. [Leetcode][Python]56: Merge Intervals
  10. ThinkPhp模板转Flask模板
  11. OutputStream类详解
  12. java PDF2JPG
  13. 屏蔽F12审查元素,禁止使用右键菜单
  14. LeetCode算法题-Same Tree(Java实现)
  15. ROS 可视化(一): 发布PointCloud2点云数据到Rviz
  16. maven发布jar包到私服
  17. UGUI之Slider使用,制作血条
  18. 1126 Eulerian Path (25 分)
  19. oracle中的分支与循环语句
  20. C#中遍历各类数据集合的方法总结

热门文章

  1. Vue3系列11--Teleport传送组件
  2. Pycharm5个非常有用的技巧
  3. [数据结构1.2-线性表] 动态数组ArrayList(.NET源码学习)
  4. rh358 002 fact变量获取 ansible配置网络 service_facts
  5. java代码审计的点
  6. Spring常用注解(SpirngBoot方面讲的更加详细)
  7. 【debug】 Linux中top的使用
  8. es日志配置,只保存最近3天的日志
  9. vivo 公司 Kubernetes 集群 Ingress 网关实践
  10. Beats:运用 Logstash 来加工 Metricbeat 数据