开胜科技-网站建设专家

售前咨询:点击这里给我发消息 点击这里给我发消息 

技术支持:点击这里给我发消息 点击这里给我发消息 

售后服务:点击这里给我发消息 点击这里给我发消息 

电话:0531-89004900

手机:18660105139

E-mail:service@openwin.cn

网络推广

Validform表单验证jquery插件的使用方法

发布时间:2014-07-27 23:03:59      浏览次数:0

     在我们进行程序开发的时候,表单提交数据是必须的,有表单进行数据的上传才叫动态网站。在进行表单提交数据的时候,表单验证也就成为了一个重要的步骤,如果不进行表单验证,有非常多的弊端。比如,可以任意提交任何数据(服务器端语言没有验证的情况下),再比如用户体验度差(用户不知道是否填写的数据正确与否)。
    那么济南网络公司为大家推荐一款非常好用的表单验证js插件“validform”。
    这款插件能够非常好的为大家提供表单验证,并且非常容易上手。
    今天以简单常用的几个功能进行讲解,详细试用操作api文档可以去官网进行阅览或者下载它的demo。
    官方网站:http://validform.rjboy.cn/
    首先需要引入css和js
    引入这两个文件,基础文件就已经ok了,对了,在引入这两个文件之前,必须引入jquery包,此插件是jquery的一个插件,须有jquery的支持
    然后,在输入框或者其他表单元素中指定数据类型,注意:数据类型必须要有,也就是下文中所说的datatype
    ps:
    datatype:为数据类型默认有*|*6-16|n|n6-16|s|s6-18|p|m|e|url这么几种类型,
    *为可以输入任何字符,包括空也可以
    *6-16可以输入6-16为字符
    n6-16可以输入6-16位数字等等
    这个也可以自己定义
    比如:*1-20意思就是可以输入1-20位任意字符
    这个datatype数据类型必须得存在,如果不存在,是不会有任何效果的
    nullmsg:为空时输出的提示信息
    errormsg:错误时输出的提示信息
    接下来我们讲解重点的一个内容
    tiptype
    这个是验证类型,默认有三种验证类型。可根据需要进行设定
    1=>自定义弹出框提示;
    2=>侧边提示(会在当前元素的父级的next对象的子级查找显示提示信息的对象,表单以ajax提交时会弹出自定义提示框显示表单提交状态);
    3=>侧边提示(会在当前元素的siblings对象中查找显示提示信息的对象,表单以ajax提交时会弹出自定义提示框显示表单提交状态);
    4=>侧边提示(会在当前元素的父级的next对象下查找显示提示信息的对象,表单以ajax提交时不显示表单的提交状态);
    如果上面的4种提示方式不是你需要的,你可以给tiptype传入自定义函数。
    $(function(){
    $(".validform").Validform({
    tiptype:3
    });
    })
    以上就是validform的简单操作使用方法,详细可查阅validform官网
开胜科技微信(openwin-cn)