HTML表单常用元素1. 下拉列表好了，关于前端的action属性和Method属性就讲到这里了。为了讲解action和method，还结合了后端的一丢丢知识，前端和后端的知识点以后都会慢慢讲到哈！
先来个前端代码：
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>彩虹运维技术栈社区主页</title>
</head>
<body>
<h2>彩虹运维技术栈社区，公众号ID：TtrOpsStack</h2>
<form action="http://192.168.11.10:8088/ttropsstack" target="_blank" method="post">
<label for="opslist">运维开发应掌握的技能：</label>
<select id="opslist" name="opslist">
<option value="python">Python语言</option>
<option value="go">Go语言</option>
<option value="Shell">Shell语言</option>
<option value="database">数据库</option>
<option value="frontend">前端</option>
<option value="Linux">Linux</option>
<option value="network">网络</option>
<option value="storage">存储</option>
</select>
<input type="submit">
</form>
</body>
</html>
后端代码：
# coding: utf8
from flask import Flask, request
webapp = Flask(__name__)
@webapp.route('/ttropsstack', methods=['GET','POST'])
def ttropsstack():
if request.method == 'POST':
a = request.form
print a.get('opslist')
return 'ok'
else:
return '提交数据需要post请求'
if __name__ == '__main__':
webapp.run(host="0.0.0.0", port=8088, debug=True)
在下拉框中选择“Go语言”，并提交
后端啥也没干，就只做了打印
前端代码：
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>彩虹运维技术栈社区主页</title>
</head>
<body>
<h2>彩虹运维技术栈社区，公众号ID：TtrOpsStack</h2>
<form action="http://192.168.11.10:8088/ttropsstack" target="_blank" method="post">
<label for="opslist">运维开发应掌握的技能：</label>
<select id="opslist" name="opslist" size="6" multiple>
<option value="python">Python语言</option>
<option value="go">Go语言</option>
<option value="shell">Shell语言</option>
<option value="database">数据库</option>
<option value="frontend">前端</option>
<option value="linux">Linux</option>
<option value="network">网络</option>
<option value="storage">存储</option>
</select>
<input type="submit">
</form>
</body>
</html>
上述前端代码中，是使用multiple属性来实现选择多个值。
后端代码的打印方式稍微做了些许调整：
# coding: utf8
from flask import Flask, request
webapp = Flask(__name__)
@webapp.route('/ttropsstack', methods=['GET','POST'])
def ttropsstack():
if request.method == 'POST':
data = request.get_data()
print data
return 'ok'
else:
return '提交数据需要post请求'
if __name__ == '__main__':
webapp.run(host="0.0.0.0", port=8088, debug=True)
按住ctrl或者shift键可进行多选
后端打印的效果图下图：
