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

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

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

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

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

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

4.点击随机抽取后 

5.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源码

<!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>

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mfbz.cn/a/441198.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

方阵的特征值与特征向量

目录 特征值 & 特征向量 相关性质 特征值 & 特征向量 相关性质

java(框架) springboot-1 基础使用+mybaits使用

学习视频&#xff1a;b站黑马java教程 tomcat spring-boot工程内嵌了tomcat服务器 所有请求经过DispatcherServlet(实现servlet接口的类)(核心控制器/前端控制器)处理&#xff0c;再通过DispatcherServlet转发给各个controller。 最后通过DispatcherServlet给浏览器响应数据…

3D数字孪生运行不起来?该检查你的电脑配置了

运行3D数字孪生项目通常需要一定的计算资源和图形处理能力。以下是一些常见的电脑配置要求&#xff0c;可以作为参考&#xff1a;1处理器&#xff08;CPU&#xff09;&#xff1a;推荐使用多核心处理器&#xff0c;如Intel Core i7或更高级别的处理器。较高的时钟频率和较大的缓…

RocketMQ的事务消息是如何实现的?

RocketMQ的事务消息是通过 TransactionListener接口来实现的。 在发送事务消息时,首先向RocketMQ Broker 发送一条‘half消息’(半消息),半消息将被存储在broker端的事务消息日志中,但是这个消息还不能被消费者消费。 接下来,在半消息发送成功后,应用程序通过执行本地事务…

msvcr110.dll丢失的5种修复方法,快速修复msvcr110.dll缺失问题

MSVCR110.dll文件的丢失可能会引发一系列的问题与不便&#xff0c;严重影响到用户的计算机使用体验。首先&#xff0c;由于MSVCR110.dll是Microsoft Visual C Redistributable Package的一部分&#xff0c;它的缺失可能导致许多基于此运行库编译的应用程序无法正常启动或运行&a…

52. N 皇后 II

52. N 皇后 II 题目-困难难度1. 回溯 题目-困难难度 n 皇后问题 研究的是如何将 n 个皇后放置在 n n 的棋盘上&#xff0c;并且使皇后彼此之间不能相互攻击。 给你一个整数 n &#xff0c;返回 n 皇后问题 不同的解决方案的数量。 示例 1&#xff1a; 输入&#xff1a;n …

蓝桥杯集训·每日一题2024 (二分,双指针)

前言&#xff1a; 开学了&#xff0c;平时学习的压力也逐渐大起来了&#xff0c;不过还算可以接受&#xff0c;等到后面阶段考的时候就不一样了&#xff0c;我目前为了转专业退选了很多课&#xff0c;这些课我都需要花时间来刷绩点&#xff0c;不然保研就没有竞争力了。我自己会…

人工蜂群算法

人工蜂群算法 人工蜂群算法&#xff08;Artificial Bee Colony Optimization,ABC&#xff09;是一种基于蜜蜂觅食行为的优化算法&#xff0c;由土耳其学者Karaboga于2005年提出&#xff0c;算法模拟蜜蜂的采蜜行为对优化问题进行求解。 算法原理 ABC算法的核心思想是将优化问…

STM32基础--构建自己的固件库

CMSIS 标准及库层次关系 因为基于 Cortex 系列芯片采用的内核都是相同的&#xff0c;区别主要为核外的片上外设的差异&#xff0c;这些差异却导致软件在同内核&#xff0c;不同外设的芯片上移植困难。为了解决不同的芯片厂商生产的 Cortex 微控制器软件的兼容性问题&#xff0…

API可视化编排,提高API可复用率

在数字化时代&#xff0c;API&#xff08;应用程序编程接口&#xff09;已成为不同软件应用之间沟通的桥梁。然而&#xff0c;如何高效管理、编排和复用这些API&#xff0c;成为了企业和开发者面临的重要挑战。随着技术的不断进步&#xff0c;RestCloud API可视化编排应运而生&…

PCIE的TLP包的封包解包原理

前言&#xff1a;开始pcie项目之前需要知道&#xff0c;本次项目我们是使用现有的框架RIFFA框架去完成设计的&#xff0c;因此比起具体代码的含义&#xff0c;更注重框架的使用。在开始项目之前需要了解PCIE的组建包过程。 一、TLP包的基本格式&#xff1a; 1.1整体包结构概述…

01-DevOps代码上线-git入门及gitlab远程仓库

一、准备学习环境 10.0.0.71-gitlab 2c2g-20GB 10.0.0.72-jenkins 2c2g-20GB 10.0.0.73-sonarqube 1c1g-20GB 10.0.0.74-nexus 1c1g-20GB 10.0.0.75-dm 1c1g-20GB &#xff08;模拟写代码服务器&#xff09; 在centos系统中&…

2024 批量下载公众号文章内容/阅读数/在看数/点赞数/留言数/粉丝数导出pdf文章备份(带留言):公众号记忆承载近1500篇历史文章在线查看,找文章方便了

关于公众号文章批量下载&#xff0c;我之前写过很多文章&#xff1a; 视频更新版&#xff1a;批量下载公众号文章内容/话题/图片/封面/音频/视频&#xff0c;导出html&#xff0c;pdf&#xff0c;excel包含阅读数/点赞数/留言数 2021陶博士2006/caoz的梦呓/刘备我祖/六神读金…

微服务架构 | 多级缓存

INDEX 通用设计概述2 优势3 最佳实践 通用设计概述 通用设计思路如下图 内容分发网络&#xff08;CDN&#xff09; 可以理解为一些服务器的副本&#xff0c;这些副本服务器可以广泛的部署在服务器提供服务的区域内&#xff0c;并存有服务器中的一些数据。 用户访问原始服务器…

HNU-算法设计与分析-甘晴void学习感悟

前言 算法设计与分析&#xff0c;仅就课程而言&#xff0c;似乎是数据结构与算法分析的延续 教材使用&#xff1a; 课程 关于课程&#xff0c;橙学长讲的非常清晰&#xff0c;我深以为然。 HNUCS-大三课程概览-CSDN博客文章浏览阅读1.3k次&#xff0c;点赞5次&#xff0c;收…

JVM-垃圾收集底层算法实现

三色标记 背景描述 在并发标记的过程中&#xff0c;因为标记期间应用线程还在继续跑&#xff0c;对象间的引用可能发生变化&#xff0c;多标和漏标的情况就有可能发生。 如何解决上面的问题&#xff1f; 引入“三色标记” 意思就是&#xff0c;把Gcroots可达性分析遍历对象过程…

【北京迅为】《iTOP-3588开发板网络环境配置手册》第4章 开发板直连电脑配置方法(无线上网)

RK3588是一款低功耗、高性能的处理器&#xff0c;适用于基于arm的PC和Edge计算设备、个人移动互联网设备等数字多媒体应用&#xff0c;RK3588支持8K视频编解码&#xff0c;内置GPU可以完全兼容OpenGLES 1.1、2.0和3.2。RK3588引入了新一代完全基于硬件的最大4800万像素ISP&…

qtvs2022工程cmakelist.txt添加QCharts模块

find_package(QT NAMES Qt5 COMPONENTS Core Gui Widgets OpenGL Concurrent Charts Sql Network REQUIRED) find_package(Qt${QT_VERSION_MAJOR} COMPONENTS Core Gui Widgets OpenGL Charts Concurrent Sql Network REQUIRED)这里find_package只是设置搜索路径&#xff0c;为…

使用ffmpeg提取视频中的音频并保存为单声道wav

1 原始视频信息 通过ffmpeg -i命令查看视频基本信息 $ ffmpeg -i C0439.MP4 ffmpeg version 6.1-essentials_build-www.gyan.dev Copyright (c) 2000-2023 the FFmpeg developersbuilt with gcc 12.2.0 (Rev10, Built by MSYS2 project)configuration: --enable-gpl --enable…

设计模式学习笔记 - 设计原则 - 10.实战:针对非业务的通用框架开发,如何做需求分析和设计及如何实现一个支持各种统计规则的性能计数器

前言 接下来我们在结合一个支持各种统计规则的性能计数项目&#xff0c;学习针对一个非业务的通用框架开发&#xff0c;如何来做需求分析、设计和实现&#xff0c;同时学习如何灵活应用各种设计原则。 项目背景 设计开发一个小的框架&#xff0c;能够获取接口调用的各种统计信…
最新文章