如何将字符串从 HTML 传递到 Python 并返回到 HTML

2023-12-02

背景:

我创建了一个非常简单的前端,用户可以在其中输入字符串。输入并单击“检查”按钮后,我想将此字符串作为 JSON 传递到 python 字符串,在其中执行 SQL 查找。根据 SQL 的外观,python 脚本应该传递一个布尔值,该值应该更改 ?到 ✔ 或 ✘。

问题:

按下“检查”按钮后,如何将字符串作为 JSON 传递到 Python 脚本,并将布尔值从 Python 传递到 HTML 以将 ? 更改为 ✔ 或 ✘?

研究:

  • 如何将 jquery 变量传递给 Python 脚本?
  • 使用 FLASK 和 jquery 发送和接收数据

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
body {font-family: Arial, Helvetica, sans-serif;}
* {box-sizing: border-box;}

input[type=text], select, textarea {
  width: 100%;
  padding: 12px;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-sizing: border-box;
  margin-top: 6px;
  margin-bottom: 16px;
  resize: vertical;
}

input[type=submit] {
  background-color: #4CAF50;
  color: white;
  padding: 12px 20px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}

input[type=submit]:hover {
  background-color: #45a049;
}

.container {
  border-radius: 5px;
  background-color: #f2f2f2;
  padding: 20px;
}


  h3 {text-align: center;}
  .center {
            display: flex;
            justify-content: center;
            align-items: center;
            }
    </style>

</style>
</head>
<body>

<h3>My Request</h3>

<div class="container">
  <form action="/action_page.php">
  
<label for="account_name">? Account Name:</label>
<input type="text" id="fname" name="firstname" placeholder="Account Name..">
<input type="submit" value="Check Account"><br><br>

<label for="contact_name">? Contact Name:</label>
<input type="text" id="lname" name="lastname" placeholder="Contact Name..">
<input type="submit" value="Check Contact"><br><br>


<label for="reseller">? Reseller:</label>
<input type="text" id="lname" name="lastname" placeholder="Reseller..">
<input type="submit" value="Check Reseller"><br><br>

<label for="issue_date">? Issue Date:</label><br>
<input type="date" id="start" name="trip-start" value="" min="2018-01-01" max="2100-12-31">

 
<br>
<div class="center">
    <input type="submit" value="VERIFY ALL">
</div>
  </form>
</div>

</body>
</html>

这只是一个示例代码,它将使您了解如何将值从客户端传递到服务器以及服务器到客户端。

假设:“Flask”是您当前的工作目录

请按照以下步骤操作:

  1. 安装烧瓶

运行以下命令

pip install Flask
  1. 创建一个Python文件app.py,将以下内容复制粘贴到此文件中。
from flask import Flask, render_template, request

app = Flask(__name__)


@app.route('/')
def index():
    return render_template('index.html')


@app.route('/greet', methods=['POST'])
def greet():
    name = request.form['name']
    return render_template('greet.html', name=name)


if __name__ == '__main__':
    app.run()
  1. 创建文件index.html在位置 '/Flasak/templates' 中
<h1>Welcome</h1>
<form action="http://localhost:5000/greet" method="POST">
    Name: <input type="text" name="name"> <button type="submit">Submit</button>
</form>
  1. 创建文件greet.html在位置 '/Flasak/templates' 中
<h2>Have a good day, {{name}}</h2>
  1. 运行 python 文件如下
python app.py
  1. 打开浏览器并点击http://localhost:5000,它将显示“欢迎”,以及一个用于输入名称的字段。提供您的姓名并点击Submit。像这样,您可以将值从客户端发送到服务器。

  2. 按下后Submit,会发生重定向,服务器会收到name并再次发送给客户。现在你应该能够看到Have a good day,以及提供的名称。

仅供参考,项目目录如下所示:

Flask
  |
  |-> templates
  |    |
  |    |-> greet.html
  |    |-> index.html
  |
  |-> app.py

Note:为了更好地理解,我建议您阅读教程。我希望这对您有帮助。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何将字符串从 HTML 传递到 Python 并返回到 HTML 的相关文章

  • 提高光线追踪命中功能的性能

    我有一个简单的 python 光线追踪器 渲染 200x200 的图像需要 4 分钟 这对于我的口味来说绝对是太多了 我想改善这种情况 几点 我为每个像素发射多条光线 以提供抗锯齿功能 每个像素总共发射 16 条光线 200x200x16
  • 使图像宽度为父 div 的 100%,但不大于其自身宽度

    我试图让图像 动态放置 对尺寸没有限制 与其父 div 一样宽 但前提是该宽度不比 100 时其自身宽度宽 我已经尝试过这个 但没有成功 img width 100 height auto max width 100 其中许多图像比它们的父
  • matplotlib vlines 图中未应用 y 轴的最小值

    我正在 matplotlib 中绘制 vlines 图 数据集中的所有 y 值如下 gt 0 我希望 y 轴最底部的刻度能够读取0 但相反 我得到 500 这是代码 usr bin env python import numpy as np
  • ImproperlyConfigured at / 不允许空静态前缀 - Django

    我正在使用 Django 上传 显示图像 该网站部署在 Heroku 上 下列的this https coderwall com p bz0sng教程我能够成功上传图像 但是 图像并未显示在模板中 然后我了解到我的 urls py 末尾应该
  • Pandas 中每列的曲线拟合 + 外推值

    我有一个包含大约 300 列的数据集 每一列都与深度相关 Pandas DataFrame 的简化版本看起来像这样 import matplotlib pyplot as plt import numpy as np import pand
  • 如何使用 jQuery 获取数组键?

    下午好 我有一个数组 其中包含一些键和值 然后我需要获取数组键而不是其中的数据 我想用 jQuery 来做到这一点 例如 我知道 PHP 有一个名为 array keys 的函数 它将数组作为参数 并返回一个数组 其中包含每个索引中的每个键
  • jQuery live() 和ready() 之间的区别?

    两者之间的确切区别是什么live and ready 编辑 发现die http docs jquery com Events die是相反的live ready http docs jquery com Events ready让你注册一
  • Django 1.7:如何使用 html/css 文件作为模板发送电子邮件

    从 Django 1 7 开始 可以send email 使用新参数 html message 不幸的是 没有关于如何使用它的全面指南 新手友好 或者至少我找不到它 我需要使发送的电子邮件变得漂亮 因此 我试图弄清楚如何将我的消息包含到 h
  • 识别http链接并创建锚标记

    我正在尝试解析一些字符串 它嵌入了一些 http 链接 我想使用 jquery 在此字符串中动态创建锚标记 然后将它们显示在前端 以便用户可以单击它们 有没有办法做到这一点 Thanks 你可以这样做 function get the st
  • 将 str.contains 映射到 pandas DataFrame

    python 初学者 我正在寻找创建字符串的字典映射以及关联的值 我有一个数据框 想要创建一个新列 如果字符串匹配 则会将该列标记为 x df pd DataFrame comp dell notebook dell notebook S3
  • 为什么我会在 Python 字符串格式中使用除 %r 之外的其他内容?

    我偶尔会使用 Python 字符串格式 这可以像这样完成 print int i Float f String s 54 34 434 some text 但是 这也可以这样做 print int r Float r String r 54
  • 如何将外部 div 的高度设置为始终等于特定内部 div 的高度?

    我有一个外部 div 其中包含三个内部 div 我希望最左边的内部 div 始终确定外部 div 的高度 如果其他内部 div 的内容 比最左边的 div 少 它们将有空白空间 如果他们有更多的内容 比最左边的div 他们将得到一个滚动条
  • 如何将Python包从旧版本安装到新版本?

    我正在使用 python 3 7 最近在 Linux 中安装了 python 3 8 是否有任何 bash 命令或脚本可以获取 3 7 的所有软件包列表并在 3 8 版本中一一安装 我想避免每个包裹都手工完成 注意 我将它们安装在我的系统中
  • 如何使用 python 模块的多个 git 分支?

    我想使用 git 来同时处理我正在编写的模块中的多个功能 我目前正在使用 SVN 只有一个工作区 因此我的 PYTHONPATH 上只有该工作区 我意识到这不太理想 所以我想知道是否有人可以建议一种更 正确 的方法来做到这一点 让我用一个假
  • 尝试 numba 时出现巨大错误

    我在使用 numba 时遇到了大量错误 讽刺的是 正确的结果是在错误之后打印的 我正在使用最新的 Anaconda python 并安装了 numba conda install numba 一次在 Ubuntu 13 64 位和 anac
  • 关闭正在运行代码的 IPython Notebook

    怎么运行的 我在 IPython Notebook 中运行了一些代码 一些迭代工作 我不小心关闭了正在运行的笔记本的浏览器 但回到 IPython 仪表板 我发现这个特定的笔记本尚未关闭 所以如果我再次打开笔记本 我会在它正在执行的代码前面
  • 如何创建简单的梯度下降算法

    我正在研究简单的机器学习算法 从简单的梯度下降开始 但在尝试用 python 实现它时遇到了一些麻烦 这是我试图重现的示例 我获得了有关房屋的数据 居住面积 以英尺为单位 和卧室数量 以及最终的价格 居住面积 英尺2 2104 卧室 3 价
  • 如何使用 jQuery 和 .ajax 方法发送数组而不转义括号?

    我试图发送具有多个值的相同参数名称 但即使在阅读了 SO 上的帖子后也无法弄清楚如何做到这一点 我想要一个数组destination input var myObject search zip params search zip searc
  • JSONDecodeError:额外数据:Python [重复]

    这个问题在这里已经有答案了 我使用以下代码从文件加载 json file file name obj list with open file as f for json obj in f obj list append loads json
  • Ie11 不应用媒体查询样式

    IE11 忽略我的媒体查询并始终使用移动 CSS 奇怪的是 如果我改变浏览器宽度 即使只是 1 2 像素 浏览器也会自行渲染并显示媒体查询 我尝试了 css lint 我的 css 中没有错误 我的CSS没有什么特别的 只是简单的 css

随机推荐

  • CASE 相当于嵌套 IIF 语句

    谁能将以下嵌套 IIF 解码为 SQL 中的 CASE 语句 我知道 SQL Server 2012 中允许使用 IIF 但我发现很难轻松掌握嵌套 IIF 逻辑 以下是我的嵌套 IIF 语句 IIF IIF TABLE A Col 1 0
  • pkg-config:未找到命令,在 Windows 7 上使用 cygwin

    我在 Windows 上使用 Cygwin 来运行此命令 g pkgconfig libs cflags opencv I o mergevec mergevec cpp 但我收到一个错误 bash pkg config command n
  • 如何捕获 ES6 Promise 拒绝并完全停止流程?

    假设我有 4 个功能 runA runB runC and runD 使用 ES6 Promise 在一次完全成功的运行中 这些都将依次运行 runA then runB then runC then runD If runA or run
  • 命令超时和连接超时之间的区别

    连接超时和命令超时有什么区别 在我们的应用程序中有时会显示超时错误 当我们将命令超时值增加到 100 默认为 30 时 它就可以工作了 增加命令超时值是否有任何问题 Thanks Mahesh ConnectionTimeout 是您的代码
  • PHP - 正确检查 $_POST['variable'] 是否已发布

    我想检查 POST submit 是否已发布 我原来的代码是 if POST submit 但我有一个带有此代码的 PHP 通知 未定义索引 提交于 因此 要删除该通知 我必须这样写 if isset POST submit 但这是没有意义
  • XGBoost:将 dmatrix 转换为 numpy.array

    我想检查一下DMatrix目的 这文档提到获取行数和列数以及每行切片的方法 dmatrix slice index 但我想使用 numpy 进行更复杂的转换 有没有简单的方法可以转换DMatrix到一个 numpy 数组 DMatrix 是
  • Laravel 更快地查询控制器或视图中的所有内容

    查询控制器中的所有内容并返回每个查询更快 还是在使用视图时查询更快 假设所有模型都有关系 Example 完成控制器中的所有操作然后返回 Public function articlesHome id art Articles find i
  • 什么时候需要在 ISR 中使用 volatile?

    我正在制作嵌入式固件 初始化后的所有事情都发生在 ISR 中 我有它们之间共享的变量 我想知道在什么情况下它们需要是易失性的 我从不阻塞 等待另一个 ISR 的变化 在不使用易失性的情况下 什么时候可以确定实际内存已被读取或写入 每个 IS
  • SolidJS 中的条件样式

    我在 SolidJS 中有一个组件 看起来像这样 const MyComponent Component params gt const votes setVotes createSignal new Set const toggle va
  • 对不同列表中相同索引的元素求和

    我有一个列表列表 其中每个内部列表代表电子表格中的一行 使用我当前的数据结构 如何对具有相同索引的内部列表上的每个元素执行操作 这基本上相当于在电子表格中的列中执行操作 这是我正在寻找的示例 就加法而言 gt gt gt lisolis 1
  • 如何在 Liferay 7 中添加新语言?

    我的问题是如何添加新语言 例如泰语liferay 7 当我检查现有标志时 我发现图像不是 png 而是 svg 但我无法使用图标添加新语言 在这个page jsp我看到图像的构造函数是自动生成的 这段代码描述了svg图像的生成
  • 获取 Windows ‘ShFileOperation’ API 在 Delphi 中递归删除文件

    我正在使用以下代码删除大量文件 function FastDelete const fromDir string Boolean var fos TSHFileOpStruct begin ZeroMemory fos SizeOf fos
  • 如何复制进程的标准输出(复制,而不是重定向)?

    有很多示例展示了如何重定向另一个应用程序的标准输出 但是 我想让应用程序保留其标准输出 并且仅在父进程中检索标准输出的副本 这可能吗 我的场景 我有一些测试 使用 Visual Studio Test Runner 启动外部进程 服务器 来
  • 有没有办法创建 ColoredCheckbox 组件?

    我正在尝试创建一个可重复使用的material ui彩色复选框组件 您将十六进制颜色传递给组件 它会影响复选框颜色 到目前为止我已经明白了 但我想不出一种将颜色传递给 withStyles 的方法 const WhiteCheckbox w
  • 提取两个相似标题之间具有特定单词的段落

    我的文本文件包含类似这样的段落 summary A result oriented and dedicated professional with three years experience in Software Development
  • 将目标添加到导航栏中的后退按钮

    我正在设置标题和后退按钮的值UINavigationBar如下 self navigationItem title Post self navigationController navigationBar setTitleTextAttri
  • 是否可以从 C# 读取内部 CPU 滴答计数器?

    我有一个多线程 C 程序 我需要记录每个线程在特定自旋等待锁中花费的时间间隔 我知道有一些方法可以从 C 或汇编程序执行此操作 但是是否可以以某种方式直接从 C 访问相同的计数器 也就是说 无需通过 Stopwatch 类 我假设调用 St
  • 如何重命名 xcode 方案并保持 Git 提交正常工作?

    更新 我将此作为错误报告给 Apple 他们修复了它 所有这些在 xCode 4 5 中似乎都可以正常工作 历史学家可以继续读下去 我非常想在 xCode 4 3 中重命名 iOS 项目的构建方案 我已成功重命名该项目 然后我可以重命名目标
  • 获取星期一和星期日等..作为 Unix 中任何日期的一周参数

    如何获取某个日期一周中的星期一和星期日的日期 这给出了 最后 星期一的日期 date dlast monday Y m d 我想传递一个日期作为参数查找该周的星期一和星期日 基本上 我想要一周的周日和周一 任何日期 不仅仅是上周一 尝试这个
  • 如何将字符串从 HTML 传递到 Python 并返回到 HTML

    背景 我创建了一个非常简单的前端 用户可以在其中输入字符串 输入并单击 检查 按钮后 我想将此字符串作为 JSON 传递到 python 字符串 在其中执行 SQL 查找 根据 SQL 的外观 python 脚本应该传递一个布尔值 该值应该