在 Flask 中执行耗时功能时显示“正在加载”图像 [重复]
Posted
技术标签:
【中文标题】在 Flask 中执行耗时功能时显示“正在加载”图像 [重复]【英文标题】：Display a ‘loading’ image while a time consuming function is executed in Flask [duplicate] 【发布时间】：2017-01-01 14:49:06 【问题描述】：我在 Flask 中有一个如下所示的应用：
app = Flask(__name__)
@app.route('/')
def start():
return render_template('page1.html') # loads the start page on the beginning
@app.route('/page2',methods=['GET','POST'])
def read():
if request.method == 'POST':
# lots of actions taking a long time
return render_template('page2.html', arg1=arg1, arg2=arg2)
我想在我的 HTML 页面上添加一张照片，该照片将显示“正在加载”，直到 page2 上传。这类似于我当前在 page1 上的 HTML：
<html>
<head>
<meta charset="UTF-8">
<title>IP / ISP Research</title>
<link rel="stylesheet"
type="text/css"
href="/static/style.css"/>
</head>
<body>
<center>
<h2>Search for something</h2>
<form class="form-style-7" action="/page2" method="POST" >
<ul>
<li>
<label for="arg1">IP</label>
<input type="text" name="arg1" value="arg1" maxlength="100">
<span>Enter arg1</span>
</li>
<li>
<label for="arg2">ISP</label>
<input type="text" name="arg2" value="arg2" maxlength="100">
<span>Enter arg2</span>
</li>
<li>
<input class="go_button" type="submit" value="GO" >
</li>
</ul>
</form>
</center>
</body>
</html>
我尝试过的事情：
主要在我的 HTML 中编写 javascript，例如 here。
还尝试为 showImage() 添加一个函数并将其添加到 HTML 表单标签：onclick="showImage()
还尝试将其添加到 HTML 按钮标签：onSubmit="return showImage()
【问题讨论】：
【参考方案1】：以 jQuery 为例：
<html>
<head>
<meta charset="UTF-8">
<title>IP / ISP Research</title>
<link rel="stylesheet"
type="text/css"
href="/static/style.css"/>
<script src="//code.jquery.com/jquery-3.1.0.min.js"
</head>
<body>
<center>
<h2>Search for something</h2>
<form class="form-style-7" action="/page2" method="POST" >
<ul>
<li>
<label for="arg1">IP</label>
<input type="text" name="arg1" value="arg1" maxlength="100">
<span>Enter arg1</span>
</li>
<li>
<label for="arg2">ISP</label>
<input type="text" name="arg2" value="arg2" maxlength="100">
<span>Enter arg2</span>
</li>
<li>
<input class="go_button" type="submit" value="GO" >
</li>
</ul>
</form>
<script>
$( ".go_button" ).submit(function( event )
# function showing loading progress bar
);
</script>
</center>
</body>
</html>
【讨论】：
谢谢，我不熟悉 javascript 或 jQuery，你能帮我写完整的函数吗？我要把它放在我的 HTML 中吗？以上是关于在 Flask 中执行耗时功能时显示“正在加载”图像 [重复]的主要内容，如果未能解决你的问题，请参考以下文章
jquery 怎么让一个div的内容未加载完时显示加载中...