Flask框架学习笔记之表单基础介绍与表单提交方式


Posted in Python onAugust 12, 2019

本文实例讲述了Flask框架学习笔记之表单基础介绍与表单提交方式。分享给大家供大家参考,具体如下:

表单介绍

表单是HTML页面中负责数据采集功能的部件。由表单标签,表单域和表单按钮组成。通过表单,将用户输入的数据提交给服务器,并交给服务端进行处理。

表单标签

用于声明表单的范围,位于表单标签的元素将被提交。

语法:<form></form>

属性:Method规定用于发送表单数据的 HTTP 方法。

          Enctype规定在向服务器发送表单数据之前如何对其进行编码。(适用于 method="post" 的情况)

          action规定当提交表单时向何处发送表单数据。(指定url)

表单域

表单域包含了文本框,密码框等多种类型

语法:<input ……/>

属性:type规定input元素类型。
          name定义input元素名称
          value规定input元素值

表单域的种类

文本框type=text

密码框type=password

文本区域type=textarea(可输入多行数据)

文件上传框type=file

单选框type=radio

复选框type=checkbox

表单按钮

    提交按钮

    复位按钮

    一般按钮

实现:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
  <form>
    <input type="text" placeholder="Text" name="text" /># text
    <input type="password" placeholder="password" name="password" /># password
    <textarea placeholder="Textarea" name="textarea" style="resize:none"></textarea># 文本区域
    <input type="file" name="file" /># 文件上传
    <input type="radio" name="Option" value="Option1" /> Option1# 单选框
    <input type="radio" name="Option" value="Option2" /> Option2
    <input type="checkbox" name="Option" value="Option1" /> Option1# 多选框
    <input type="checkbox" name="Option" value="Option2" /> Option2
    <input type="submit" value="Submit" /># submit按钮
    <input type="reset" value="Reset" /># 重置按钮
    <input type="button" value="button" /># 普通按钮
  </form>
</body>
</html>

Flask框架学习笔记之表单基础介绍与表单提交方式

普通按钮下没有js语言支持是无效果的。

这里编写一个简单的js脚本来实现点击button弹出表单中的信息:

function getValue()
{
 var text=document.form1.text1.value;
 alert(text)
}

html程序:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
  <script type="text/javascript" src="../static/j.js"></script># 这里插入js脚本
</head>
<body>
  <form name="form1"># 添加表单名字
    <input type="text" placeholder="Text" name="text1" /># 修改text表单名
    <input type="password" placeholder="password" name="password" />
    <textarea placeholder="Textarea" name="textarea" style="resize:none"></textarea>
    <input type="file" name="file" />
    <input type="radio" name="Option" value="Option1" /> Option1
    <input type="radio" name="Option" value="Option2" /> Option2
    <input type="checkbox" name="Option" value="Option1" /> Option1
    <input type="checkbox" name="Option" value="Option2" /> Option2
    <input type="submit" value="Submit" />
    <input type="reset" value="Reset" />
    <input type="button" value="button" οnclick="getValue()" /># 点击就调用getValue()函数
  </form>
</body>
</html>

Flask框架学习笔记之表单基础介绍与表单提交方式

表单的提交方式

GET和POST

    GET方式通过URL提交数据,数据在URL中可以看到。

    POST方式,数据放置在HTML Header中提交

两种提交方式的区别

    GET请求可以被浏览器缓存

    POST所请求的URL可以被缓存,但数据不会被缓存

    POST请求不便于分享

    POST请求没有长度限制

    GET请求的数据暴露在URL中,会带来一些安全问题。

GET方式的适用场合

    单纯的请求数据,不进行其他操作

    表单数据较短,不超过1024个字符

    对安全性要求一般的场合

POST方式适用的场合

    数据不仅仅用于请求,或提交上传数据。

    表单数据过长时

    要传送的数据不是ASCII编码

希望本文所述对大家基于flask框架的Python程序设计有所帮助。

Python 相关文章推荐
python算法学习之基数排序实例
Dec 18 Python
python读取浮点数和读取文本文件示例
May 06 Python
Python中列表和元组的相关语句和方法讲解
Aug 20 Python
使用python和pygame绘制繁花曲线的方法
Feb 24 Python
Python中常用的内置方法
Jan 28 Python
python绘制漏斗图步骤详解
Mar 04 Python
在Python中预先初始化列表内容和长度的实现
Nov 28 Python
keras 获取某层输出 获取复用层的多次输出实例
May 23 Python
python 实现超级玛丽游戏
Nov 25 Python
Python 实现劳拉游戏的实例代码(四连环、重力四子棋)
Mar 03 Python
Tensorflow与RNN、双向LSTM等的踩坑记录及解决
May 31 Python
用python批量解压带密码的压缩包
May 31 Python
python内存管理机制原理详解
Aug 12 #Python
Flask框架学习笔记之路由和反向路由详解【图文与实例】
Aug 12 #Python
python实现图片压缩代码实例
Aug 12 #Python
django与vue的完美结合_实现前后端的分离开发之后在整合的方法
Aug 12 #Python
一行Python代码过滤标点符号等特殊字符
Aug 12 #Python
一篇文章弄懂Python中的可迭代对象、迭代器和生成器
Aug 12 #Python
Django认证系统实现的web页面实现代码
Aug 12 #Python
You might like
《斗罗大陆》六翼天使武魂最强,为什么老千家不是上三宗?
2020/03/02 国漫
linux中cd命令使用详解
2015/01/08 PHP
利用Homestead快速运行一个Laravel项目的方法详解
2017/11/14 PHP
Alliance vs Liquid BO3 第二场2.13
2021/03/10 DOTA
JavaScript 函数式编程的原理
2009/10/16 Javascript
javascript一个无懈可击的实例化XMLHttpRequest的方法
2010/10/13 Javascript
公共js在页面底部加载的注意事项介绍
2013/07/18 Javascript
回车直接实现点击某按钮的效果即触发单击事件
2014/02/27 Javascript
Javascript基础教程之数据类型 (布尔型 Boolean)
2015/01/18 Javascript
JavaScript DSL 流畅接口(使用链式调用)实例
2015/03/15 Javascript
js实现兼容IE、Firefox的图片缩放代码
2015/12/08 Javascript
学习JavaScript设计模式之装饰者模式
2016/01/19 Javascript
js插件dropload上拉下滑加载数据实例解析
2016/07/27 Javascript
BootStrap selectpicker后台动态绑定数据
2017/06/01 Javascript
webpack项目轻松混用css module的方法
2018/06/12 Javascript
详解extract-text-webpack-plugin 的使用及安装
2018/06/12 Javascript
快速解决bootstrap下拉菜单无法隐藏的问题
2018/08/10 Javascript
js实现简单的贪吃蛇游戏
2020/04/23 Javascript
Python配置文件解析模块ConfigParser使用实例
2015/04/13 Python
Python中http请求方法库汇总
2016/01/06 Python
python利用matplotlib库绘制饼图的方法示例
2016/12/18 Python
Python数据拟合与广义线性回归算法学习
2017/12/22 Python
Python 字符串转换为整形和浮点类型的方法
2018/07/17 Python
Python实现的特征提取操作示例
2018/12/03 Python
python 使用pandas计算累积求和的方法
2019/02/08 Python
python 按钮点击关闭窗口的实现
2020/03/04 Python
Python web如何在IIS发布应用过程解析
2020/05/27 Python
欧洲、亚洲、非洲和拉丁美洲的度假套餐:Great Value Vacations
2019/03/30 全球购物
高中生学习生活的自我评价
2013/10/09 职场文书
2015年元旦文艺汇演主持词
2014/03/26 职场文书
2014年女职工工作总结
2014/11/27 职场文书
违纪学生保证书
2015/02/27 职场文书
2015年汽车销售员工作总结
2015/07/24 职场文书
标准演讲稿格式结尾应该怎么书写?
2019/07/17 职场文书
MYSQL主从数据库同步备份配置的方法
2021/05/26 MySQL
Python自动操作神器PyAutoGUI的使用教程
2022/06/16 Python