表单验证

H5表单input标签新增type

匿名 (未验证) 提交于 2019-12-02 23:32:01
示例代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <form action=""> <!--email提供了默认的电子邮箱的完整验证:要求必须包含@符号,同时必须包含服务器名称,如果不能满足验证,则会阻止当前的数据提交--> 邮箱:<input type="email"> <br> <!--tel它并不是来实现验证。它的本质目的是为了能够在移动端打开数字键盘。意味着数字键盘限制了用户只能输入数字。 如何查看效果:qq发送文件>>手机端使用qq来接收>>使用手机浏览器查看--> 电话:<input type="tel"> <br> <!--验证只能输入合法的网址:必须包含http://--> 网址:<input type="url"> <br> <!--number:只能输入数字(包含小数点),不能输入其它的字符 max:最大值 min:最小值 value:默认值--> 数量:<input type="number" value="60" max="100" min="0"> <br> <!--search:可以提供更人性化的输入体验--> 请输入商品名称:<input type="search"> <br> <!-

后台防止表单重复提交

匿名 (未验证) 提交于 2019-12-02 23:32:01
方案一:利用Session防止表单重复提交 具体的做法:   1、获取用户填写用户名和密码的页面时向后台发送一次请求,这时后台会生成唯一的随机标识号,专业术语称为Token(令牌)。   2、将Token发送到客户端的Form表单中,在Form表单中使用隐藏域来存储这个Token,表单提交的时候连同这个Token一起提交到服务器端。   3、服务器端判断客户端提交上来的Token与服务器端生成的Token是否一致,如果不一致,那就是重复提交了,此时服务器端就可以不处理重复提交的表单。如果相同则处理表单提交,处理完后清除当前用户的Session域中存储的标识号。 看具体的范例:   1.创建FormServlet,用于生成Token(令牌)和跳转到form.jsp页面 import java.io.IOException; import javax.servlet.ServletException; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; public class FormServlet extends HttpServlet { private static

coding++ :Layui-form 表单模块

蹲街弑〆低调 提交于 2019-12-02 23:03:23
虽然对layui比较熟悉了,但是今天有时间还是将layui的form表单模块重新看一下。 https://www.layui.com/doc/modules/form.html 1):更新渲染 layui没有双向绑定机制,但是有经典模块化框架 只需要执行下面的方法即可: form.render(type,filter) 第一个参数:type form.render(); //更新全部 form.render('select'); //刷新select选择框渲染 [select,checkbox,radio] //刷新[select选择框,checkbox复选框(含开关)][radio]渲染 第二个参数:filter【可用于局部更新】为 class="layui-form" 所在元素的 lay-filter="" 的值。你可以借助该参数,对表单完成局部更新。 <div class="layui-form" lay-filter="test1"></div> <div class="layui-form" lay-filter="test2"></div> <script>   form.render(null, 'test1'); //更新 lay-filter="test1" 所在容器内的全部表单状态   form.render('select', 'test2'); //更新

Python Flask学习_使用Flask-wtf和web表单

匿名 (未验证) 提交于 2019-12-02 22:54:36
HTML中的<form> 元素表示表单,表单用于收集用户输入。 之前,学习使用request.form获取表单数据。但是有些任务重复单调,可以实现自动化管理,比如 : 生成表单的HTML代码、验证提交的表单数据。 Flask-wtf是flask的一个扩展,可以把重复工作变得更简单。 一、安装flask-wtf和跨站请求伪造保护(CSRF) app的config字典用来存储框架、扩展和程序本身的配置变量。 二、使用flask-wtf 在这个示例中,NameForm表单有一个 名为name的文本字段(我感觉类似于Qt中的QLineEdit类)和一个名为submit的提交按钮(感觉类似于Qt中的QPushButton类) 。字段(StringField和SubmitField)的构造函数的第一参数对应HTML的标号(用以显示的字)。 name = StringField('What is your name?',validators=[Required()]) validators指定一个由验证函数组成的列表 。(验证函数,我感觉就是对用户输入的一种检查:排除非法输入)。 附:WTFForms支持的HTML标注字段 附:WTForms 内建的 验证函数 文章来源: Python Flask学习_使用Flask-wtf和web表单

flask二

匿名 (未验证) 提交于 2019-12-02 22:11:45
jinja2模板规范 在当前项目中创建一个文件为templates的文件夹,将其设置为模板文件夹,新建的html为模板页面, 在视图函数中使用render_template(".html的文件", my_list=mylist),my_list作为在模板页面使用的的变量 {{ my_list}} 过滤器 符号 "|" 管道左边作为输入传一个变量到管道右边进行输出 safe 对字符串的html标签的代码进行解析,并以html显示在当前文件 reverse 翻转 upper 大写 lower 小写等 自定义过滤器(本身相当于一个函数) @app.template_filter("valreverse") #将其添加到过滤器组中 def add_after(value): value += "Hello world" result = "¥" + value + "&&" return result 模板中的for和if {% for ret in result %} {% if loop.index == 1 %} <li style="background-color: red">{{ ret.data }}</li> alert({{ ret.data }}) {% elif loop.index == 2 %} <li style="background-color: green

关于对jquery.validate表单验证插件问题的使用、多个name值相同会出错及自定义正则的方式

匿名 (未验证) 提交于 2019-12-02 21:53:52
首先是引入jquery.validate文件,这就不多说了,直接进入正题,要注意的是, 如果想要让默认的提示显示成中文,记得引入messages_zh.min.js文件哦 ,不需要的话就算了! 首先我创建一个表单 <form id="userInfoForm" method="post" action=""> <p> <label for="username">用户名</label> <input id="username" name="username" type="text" > </p> </form> 然后就可以进行验证了 $("#userInfoForm").validate({ onfocusout:false, //是否在失去焦点时触发验证 默认是true 这个可以忽略 rules: { username: { required: true, //不能为空 minlength: 2 //最少不能小于2个字符 } }, messages: { username:"请正确填写信息" } }); 需要注意的是:username找的是name中的username,我用红色标注了 然后就是多个name名字相同会出错的问题 if ($.validator) { $.validator.prototype.elements = function () { var validator

Element表单验证(1)

匿名 (未验证) 提交于 2019-12-02 21:53:52
首先要掌握Element官方那几个表单验证的例子,然后才看下面的教程。 Element主要使用了 async-validator 这个库作为表单验证 async-validator 主要分成三部分 Validate Options Rules 其中,对于我们使用Element的来说,Rules最重要,也是这部分内容较多的。 async-validator基本使用 import Validator from 'async-validator' // 规则的描述 const rules = { name: { type: 'string', required: true } } // 根据规则生成验证器 const validator = new Validator(rules) // 要验证的数据源 const source = { name: 'LanTuoXie' } // 验证后的回调函数 function callback (errors, fileds) { if (errors) { // 验证不通过,errors是一个数组,记录那些不通过的错误信息 // fileds是所有数据源的字段名,也即上面的source的'name' // 验证是根据字段名来的,rules.name 对应 source.name。 字段名要一样才会验证 } // 下面是验证通过的逻辑 } //

JavaScript---DOM对象(DHTML)

匿名 (未验证) 提交于 2019-12-02 21:53:52
1、什么是DOM? DOM 是 W3C(万维网联盟)的标准。 DOM 定义了访问 HTML 和 XML 文档的标准: "W3C 文档对象模型(DOM)是中立于平台和语言的接口,它允许程序和脚本动态地访问和更新文档的内容、结构和样式。" W3C DOM 标准被分为 3 个不同的部分: 核心 DOM - 针对任何结构化文档的标准模型 XML DOM - 针对 XML 文档的标准模型 HTML DOM - 针对 HTML 文档的标准模型 什么是 XML DOM? ---->XML DOM 定义了所有 XML 元素的对象和属性,以及访问它们的方法。 什么是 HTML DOM?---->HTML DOM 定义了所有 HTML 元素的对象和属性,以及访问它们的方法。 2、DOM 节点 根据 W3C 的 HTML DOM 标准,HTML 文档中的所有内容都是节点(NODE): 整个文档是一个文档节点(document对象) 每个 HTML 元素是元素节点(element 对象) HTML 元素内的文本是文本节点(text对象) 每个 HTML 属性是属性节点(attribute对象) 注释是注释节点(comment对象) 画dom树是为了展示文档中各个对象之间的关系,用于对象的导航。 节点(自身)属性: attributes - 节点(元素)的属性节点 innerHTML - 节点(元素

forms表单控件所有内置函数

牧云@^-^@ 提交于 2019-12-02 21:27:34
Field required=True, 是否允许为空 widget=None, HTML插件 label=None, 用于生成Label标签或显示内容 initial=None, 初始值 help_text='', 帮助信息(在标签旁边显示) error_messages=None, 错误信息 {'required': '不能为空', 'invalid': '格式错误'} validators=[], 自定义验证规则 localize=False, 是否支持本地化 disabled=False, 是否可以编辑 label_suffix=None Label内容后缀 CharField(Field) max_length=None, 最大长度 min_length=None, 最小长度 strip=True 是否移除用户输入空白 IntegerField(Field) max_value=None, 最大值 min_value=None, 最小值 FloatField(IntegerField) ... DecimalField(IntegerField) max_value=None, 最大值 min_value=None, 最小值 max_digits=None, 总长度 decimal_places=None, 小数位长度 BaseTemporalField(Field)

前端-HTML-web服务本质-HTTP协议-请求-标签-01-临时

匿名 (未验证) 提交于 2019-12-02 20:32:16
Ŀ¼ title style link script meta day40-43 在讲优酷项目 仅是对前端知识的小总结(比较片面,不具备多少参考性) 任何 与用户直接打交道的操作界面 都可以称之为前端 比如: 电脑界面、手机界面、平板界面 暂时理解成幕后操作者,不直接和用户打交道 前端三剑客: HTML、CSS、JavaScript 前端框架: Bootstrap、VUE、React... 我们的浏览器端(B/S架构)本质上也是一个客户端,通过socket与服务端通信,发送请求,获得返回数据,再有浏览器将服务器返回的数据渲染成页面上看到的一个一个标签元素样式。 手写一个简易的服务端做测试 import socket server = socket.socket() server.bind(('127.0.0.1', 8080)) server.listen(5) while True: conn, addr = server.accept() data = conn.recv(1024) print(data) conn.send(data.upper()) conn.close() 浏览器直接请求服务端的地址(在地址栏输入 ip+端口) 服务端收到响应(不需要写客户端,浏览器就相当于客户端(B/S本质就是C/S架构)) 浏览器(客户端)朝服务端 发送请求 服务端 接收请求 服务端