一、實現流程介紹
下面是優化后代碼，只是展示手機號功能，后端邏輯可以根據自己需求實現
from flask import Flask, request, render_template
auth = Flask(__name__)
@auth.route('/crm_msg', methods=['GET', 'POST'])
def crm_msg():
if request.method =='POST':
count = request.form["phone"]
return count
return render_template('index.html')
if __name__ == '__main__':
auth.run(debug=True)
二、運行腳本會生成一個網址
三、瀏覽器訪問連接，記得后面加上路由
四、附上html腳本
<html>
<head>
<title>Purple_loginform Website Template | Home :: w3layouts</title>
<link href="/static/css/style.css" rel="stylesheet" type="text/css" media="all" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
.big{
font-size:20px;
}
a{
text-decoration:none;
}
.font_bk{border:1px solid #ccc;
bai#content {
border: solid #f00; /*設置邊框樣式跟顏色du*/
margin: 0 auto; /*設置div居中*/
width: 200px; /*設置div寬度*/
height: 200px; /*設置div高度*/
border-width: 5px; /*設置邊框寬度*/
background: #ff0; /*設置背景色*/
}
</style>
</head>
<!-- contact-form -->
<div class="message warning">
<div class="inset">
<img src="https://pic50.t8tcdn.com/adcms/ad/201811/28/ce1a1b88849e763383c5ade218f73d8c93218.jpg" style="width: 1910.4px;height:75.8px"/>
<div class="login-head">
<h2>請輸入手機號查詢驗證碼</h2>
<div class="alert-close"> </div>
</div>
<form action="{{ url_for('crm_msg') }}" method="post">
<li>
<input type="text" name="phone" class="text" value="phoneNo" onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'phoneNo';}"><a href="#" class=" icon user"></a>
</li>
<div class="clear"> </div>
<li>
<!--<input type="password" name="password" value="Password" onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'Password';}"> <a href="#" class="icon lock"></a>
</li> -->
<div class="clear"> </div>
<div class="submit">
<input type="submit" value="查詢" >
<h2 align="center" 環節導航>
<div class="big">
<h3>常用工具</h3><hr>
<a href="https://tool.lu/timestamp/" target="_blank">時間戳轉換工具</a>•
<a href="https://www.json.cn//" target="_blank">Json解析工具</a>•
<a href="https://cli.im/" target="_blank">草料二位碼</a>
</div>
<div class="clear"> </div>
</div>
</form>
</div>
</div>
</div>
<div class="clear"> </div>
<!--- footer --->
<div class="footer">
<p>@Author : owen.liu jack</p>
</div>
</body>
</html>