Python学习笔记-Flask实现简单的抽奖程序(增加图片显示)

1.创建static文件夹,存放图片文件

2.hero列表数据更改为要抽奖的图片名

3.html中可以编写python语句,遍历hero列表内容渲染到表格中

4.在点击随机抽取后,可以获得名称,然后使用img标签,将获取的名称拼接到路径中

3.初始页面,访问127.0.0.1:5000/index

4.点击随机抽取后

5.python源码

python 复制代码
#让我们的电脑支持服务访问,需要一个web框架flask
from flask import Flask,render_template
from random import randint

app = Flask(__name__)

hero = ['梁祝','惊鸿之笔','修竹墨客','太华','天狼溯光者','炽翼辉光','破魔之箭','箭羽风息','花见巫女']
@app.route('/index')
def index():
    return render_template('index.html',hero=hero)

@app.route('/choujiang')
def choujiang():
    num = randint(0,len(hero)-1)
    return render_template('index.html',hero = hero , h = hero[num])

app.run(debug=True)

6.html源码

html 复制代码
<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <style>
        table{
            border-collapse: collapse
            }
        table,tbody,tr,td{
            text-align: center;
            border: 1px solid blue
        }
    </style>
</head>
<body>
<!--英雄列表-->
{{hero}}
<table align="center">
    <tbody>
    {% for i in hero %}
    <tr><td>{{i}}</td></tr>
    {%endfor%}
    </tbody>
</table>
<br>
<a href="/choujiang">随机抽取</a> <br>
您抽到了:<strong>{{h}}</strong>
<img src="../static/{{h}}.jpg">
</body>
</html>
相关推荐
何大春3 分钟前
【弱监督语义分割】Self-supervised Image-specific Prototype Exploration for WSSS 论文阅读
论文阅读·人工智能·python·深度学习·论文笔记·原型模式
在下不上天12 分钟前
Flume日志采集系统的部署,实现flume负载均衡,flume故障恢复
大数据·开发语言·python
SEVEN-YEARS15 分钟前
深入理解TensorFlow中的形状处理函数
人工智能·python·tensorflow
EterNity_TiMe_20 分钟前
【论文复现】(CLIP)文本也能和图像配对
python·学习·算法·性能优化·数据分析·clip
Suyuoa31 分钟前
附录2-pytorch yolov5目标检测
python·深度学习·yolo
好看资源平台2 小时前
网络爬虫——综合实战项目:多平台房源信息采集与分析系统
爬虫·python
进击的六角龙2 小时前
深入浅出:使用Python调用API实现智能天气预报
开发语言·python
檀越剑指大厂2 小时前
【Python系列】浅析 Python 中的字典更新与应用场景
开发语言·python
湫ccc2 小时前
Python简介以及解释器安装(保姆级教学)
开发语言·python
孤独且没人爱的纸鹤2 小时前
【深度学习】:从人工神经网络的基础原理到循环神经网络的先进技术,跨越智能算法的关键发展阶段及其未来趋势,探索技术进步与应用挑战
人工智能·python·深度学习·机器学习·ai