Validform表单验证总结

article/2025/9/10 10:11:41

 

近期项目里用到了表单的验证,选择了Validform_v5.3.2。

先来了解一下一些基本的参数:

通用表单验证方法:
Demo:

复制代码
$(".demoform").Validform({//$(".demoform")指明是哪一表单需要验证,名称需加在form表单上;
btnSubmit:"#btn_sub", //#btn_sub是该表单下要绑定点击提交表单事件的按钮;如果form内含有submit按钮该参数可省略;
btnReset:".btn_reset",//可选项 .btn_reset是该表单下要绑定点击重置表单事件的按钮;
tiptype:1, //可选项 1=>pop box,2=>side tip(parent.next.find; with default pop),3=>side tip(siblings; with default pop),4=>side tip(siblings; none pop),默认为1,也可以传入一个function函数,自定义提示信息的显示方式(可以实现你想要的任何效果,具体参见demo页);
ignoreHidden:false,//可选项 true | false 默认为false,当为true时对:hidden的表单元素将不做验证;
dragonfly:false,//可选项 true | false 默认false,当为true时,值为空时不做验证;
tipSweep:true,//可选项 true | false 默认为false,只在表单提交时触发检测,blur事件将不会触发检测(实时验证会在后台进行,不会显示检测结果);
label:".label",//可选项 选择符,在没有绑定nullmsg时查找要显示的提示文字,默认查找".Validform_label"下的文字;
showAllError:false,//可选项 true | false,true:提交表单时所有错误提示信息都会显示,false:一碰到验证不通过的就停止检测后面的元素,只显示该元素的错误信息;
postonce:true, //可选项 表单是否只能提交一次,true开启,不填则默认关闭;
ajaxPost:true, //使用ajax方式提交表单数据,默认false,提交地址就是action指定地址;
datatype:{//传入自定义datatype类型,可以是正则,也可以是函数(函数内会传入一个参数);
"*6-20": /^[^\s]{6,20}$/,
"z2-4" : /^[\u4E00-\u9FA5\uf900-\ufa2d]{2,4}$/,
"username":function(gets,obj,curform,regxp){
//参数gets是获取到的表单元素值,obj为当前表单元素,curform为当前验证的表单,regxp为内置的一些正则表达式的引用;
var reg1=/^[\w\.]{4,16}$/,
reg2=/^[\u4E00-\u9FA5\uf900-\ufa2d]{2,8}$/;if(reg1.test(gets)){return true;}
if(reg2.test(gets)){return true;}
return false;//注意return可以返回true 或 false 或 字符串文字,true表示验证通过,返回字符串表示验证失败,字符串作为错误提示显示,返回false则用errmsg或默认的错误提示;
},
"phone":function(){
// 5.0 版本之后,要实现二选一的验证效果,datatype 的名称 不 需要以 "option_" 开头;    
}
},
usePlugin:{
swfupload:{},
datepicker:{},
passwordstrength:{},
jqtransform:{
selector:"select,input"
}
},
beforeCheck:function(curform){
//在表单提交执行验证之前执行的函数,curform参数是当前表单对象。
//这里明确return false的话将不会继续执行验证操作;    
},
beforeSubmit:function(curform){
//在验证成功后,表单提交前执行的函数,curform参数是当前表单对象。
//这里明确return false的话表单将不会提交;    
},
callback:function(data){
//返回数据data是json格式,{"info":"demo info","status":"y"}
//info: 输出提示信息;
//status: 返回提交数据的状态,是否提交成功。如可以用"y"表示提交成功,"n"表示提交失败,在ajax_post.php文件返回数据里自定字符,主要用在callback函数里根据该值执行相应的回调操作;
//你也可以在ajax_post.php文件返回更多信息在这里获取,进行相应操作;
//ajax遇到服务端错误时也会执行回调,这时的data是{ status:**, statusText:**, readyState:**, responseText:** };//这里执行回调操作;
//注意:如果不是ajax方式提交表单,传入callback,这时data参数是当前表单对象,回调函数会在表单验证全部通过后执行,然后判断是否提交表单,如果callback里明确return false,则表单不会提交,如果return true或没有return,则会提交表单。
}
});Validform对象的方法和属性:
tipmsg:自定义提示信息,通过修改Validform对象的这个属性值来让同一个页面的不同表单使用不同的提示文字;
dataType:获取内置的一些正则;
eq(n):获取Validform对象的第n个元素;
ajaxPost(flag,sync,url):以ajax方式提交表单。flag为true时,跳过验证直接提交,sync为true时将以同步的方式进行ajax提交,传入了url地址时,表单会提交到这个地址;
abort():终止ajax的提交;
submitForm(flag,url):以参数里设置的方式提交表单,flag为true时,跳过验证直接提交,传入了url地址时,表单会提交到这个地址;
resetForm():重置表单;
resetStatus():重置表单的提交状态。传入了postonce参数的话,表单成功提交后状态会设置为"posted",重置提交状态可以让表单继续可以提交;
getStatus():获取表单的提交状态,normal:未提交,posting:正在提交,posted:已成功提交过;
setStatus(status):设置表单的提交状态,可以设置normal,posting,posted三种状态,不传参则设置状态为posting,这个状态表单可以验证,但不能提交;
ignore(selector):忽略对所选择对象的验证;
unignore(selector):将ignore方法所忽略验证的对象重新获取验证效果;
addRule(rule):可以通过Validform对象的这个方法来给表单元素绑定验证规则;
check(bool,selector):对指定对象进行验证(默认验证当前整个表单),通过返回true,否则返回false(绑定实时验证的对象,格式符合要求时返回true,而不会等ajax的返回结果),bool为true时则只验证不显示提示信息;
config(setup):可以通过这个方法来修改初始化参数,指定表单的提交地址,给表单ajax和实时验证的ajax里设置参数;

转载于:https://www.cnblogs.com/xfdmb/p/5757718.html


http://chatgpt.dhexx.cn/article/OC05iu1I.shtml

相关文章

数据分析方法与模型

文章目录 1 数据分析1.1 占比分析1.2 趋势分析1.3 对比分析1.4 象限分析1.5 排名分析1.6 维度分析 2 分析模型2.1 费米问题-大致估算2.2 七问分析法-思考角度的拓展2.3 互联网通用模型AARRR、八角分析法2.3.1 AARRR2.3.2 游戏化用户增长策略-八角模型 本文来源,为接…

在mysql中数据模型三要素_数据模型三要素是什么?

展开全部 数据模型三要素是数据结构、数据操作、数据约束。 1、数据结构 是计算机存储、62616964757a686964616fe78988e69d8331333431376634组织数据的方式。数据结构是指相互之间存在一种或多种特定关系的数据元素的集合,即带“结构”的数据元素的集合。。通常情况下&#xff…

数据库系统常用的数据模型

数据库系统常用的数据模型 一、层次模型二、网状模型三、关系模型 数据库的发展经历了初始阶段、萌芽阶段、初级阶段、中级阶段、高级阶段,这个过程也产生了多个不同的数据模型,接下来我们讲详细介绍数据库的模型 数据库的发展史 数据库的发展史 初始阶段…

(常见)数据模型

文章目录 数据模型概述一、数据模型概要1.模型、建模与抽象2.数据模型3.两类数据模型 二、数据库模型的组成要素1.数据结构2.数据操作3.数据的完整性约束 三、概念模型1.概要2.基本概念3.概念模型的表示方法 常用数据模型一、层次模型1.简介2.数据结构3.数据操纵与完整性约束4.…

2、机器学习三要素之数据、模型、算法

注: 本系列 课程源于李烨 (微软高级软件工程师)老师的文档 在gitbook 上可以买到李老师课程。 机器学习三要素包括数据、模型、算法。简单来说,这三要素之间的关系,可以用下面这幅图来表示: 总结成一句话:算法通过…

数据库系统的三种数据模型

数据模型: 数据模型(Data Model)是数据特征的抽象。数据(Data)是描述事物的符号记录,模型(Model)是现实世界的抽象。数据模型从抽象层次上描述了系统的静态特征、动态行为和约束条件&#xff0c…

数据模型简介

一张地图、售楼处小区的沙盘、一架精巧的航模飞机都是具体的模型,可以让人联想到真是生活中的事物,模型是对现实世界中某个对象特性的模拟和抽象。 数据模型(data model)也是一种模型,是对现实世界数据特征的抽象。人…

mysql数据模型三要素_数据模型的作用及三要素是什么?

展开全部 数据模型三要素是数据结构、数据操作、数据约束。 1、数据结构 是计算机存储636f707962616964757a686964616f31333431376634、组织数据的方式。数据结构是指相互之间存在一种或多种特定关系的数据元素的集合,即带“结构”的数据元素的集合。。通常情况下,精…

数据库的三种模型

前言 数据模型是数据库系统的核心,本文简要介绍三种主要的数据库模型。 一、格式化模型 格式化模型是层次模型和网状模型的统称 1.层次模型 ① 层次数据模型的概念 层次模型用属性结构来表示各类实体以及实体间的联系 ② 层次模型的数据结构 特点&#xff1a…

关系数据模型的三个组成部分(关系数据模型的三个组成部分)

关系数据模型由什么组成 关系数据模型由含有相同数据类型的若干行组成。每一行有若干个字段。每一个字段各自可以有不同的数据类型。关系模型中的数据操作是集合操作,操作对象和操作结果都是关系,即若干元组的集合,而不象非关系模型中那样是单…

三种数据模型

数据库的类型是根据数据模型来划分的,而任何一个DBMS也是根据数据模型有针对性地设计出来的,这就意味着必须把数据库组织成符合DBMS规定的数据模型。目前成熟地应用在数据库系统中的数据模型有:层次模型、网状模型和关系模型。它们之间的根本…

数据模型组成要素

最近在看工作机会,目前的公司涨薪的机会渺茫,加上通勤过长。看来换份工作势在必行了。言归正传更新最新学习笔记。 一、数据模型的组成要素 精确地描述了系统的静态特性、动态特性和完整性约束条件三部分组成: 数据结构–描述系统的静态特性 刻画数据模型性质的重要方面 …

java stream 遍历map_遍历map的五种方法介绍

日常开发中Map集合遍历是经常使用的,下面介绍几种遍历方法的差异。 (推荐教程:java课程) 1、IteratorentrySet写法【推荐JDK8以下】,Map.Entry是Map接口的内部接口,获取迭代器,然后依次取出每个迭代器里面的Map.EntryI…

Java中如何遍历Map对象

欢迎支持笔者新作:《深入理解Kafka:核心设计与实践原理》和《RabbitMQ实战指南》,同时欢迎关注笔者的微信公众号:朱小厮的博客。 欢迎跳转到本文的原文链接:https://honeypps.com/java/java-how-to-traverse-map-object/ 博主有时…

java遍历map(java遍历map的key)

java中map集合怎么遍历 遍历方法代码如下: import java.util.HashMap; import java.util.Map; public class App01 { public static void main(String[] args) { Map map1 new HashMap (); map1.put("A", "ABC"); map1.put("B", &qu…

js遍历map(js遍历map对象)

javascript怎么遍历map var map new HashMap();map.put(a,1);map.put(b,2);遍历:var key map.keySet();for (var i in key){ alert(map.get(key[i]));}注:js 中使用map,要先导入一个HashMap.js文件 没要求,引入这个文…

Java中如何遍历Map对象的4种方法

在Java中如何遍历Map对象 How to Iterate Over a Map in Java 在java中遍历Map有不少的方法。我们看一下最常用的方法及其优缺点。 既然java中的所有map都实现了Map接口,以下方法适用于任何map实现(HashMap, TreeMap, LinkedHashMap, Hashtable, 等等…

遍历map的四种方法

Map.entrySet() 这个方法返回的是一个Set<Map.Entry<K,V>>&#xff0c;Map.Entry 是Map中的一个接口&#xff0c;他的用途是表示一个映射项&#xff08;里面有Key和Value&#xff09;&#xff0c;而Set<Map.Entry<K,V>>表示一个映射项的Set。Map.Entry…

遍历Map的六种方式

遍历Map的六种方式 一.创建Map二.遍历Map方式一&#xff1a;使用entrySet遍历(推荐使用)方式二&#xff1a;使用keySet遍历方式三&#xff1a;使用entrySetIterator遍历方式四&#xff1a;使用keySetIterator遍历方式五&#xff1a;使用keySet、values方法遍历方式六&#xff1…

Map.entry详解

Map.entrySet() 这个方法返回的是一个Set<Map.Entry<K,V>>,Map.Entry 是Map中的一个接口,他的用途是表示一个映射项(里面有Key和Value),而Set<Map.Entry<K,V>>表示一个映射项的Set。Map.Entry里有相应的getKey和getValue方法,即JavaBean,让我们…