表单印证和表单无刷新ajax提交完美结合的插件
表单验证和表单无刷新ajax提交完美结合的插件
先说一下这个插件的特点
1、将表单验证和ajax表单提交功能和在一起,这是非常方便的,而且功能很强大
2、虽然集成了这么强大的功能,但是代码压缩之后还是非常小的,只有7KB,性能非常优秀
3、很有趣的遮罩层,只会覆盖表单域的范围哦!
4、可以手动的选择是否进行ajax无刷新表单提交,当你选择不进行无刷新表单提交的时候,这款插件就相当于一个表单验证插件。
5、如果您是CSS高手,您也可以对Focus提示的样式进行修改。
6、插件配置插件相对于之前的一个版本要简单多了,调用更加的简单
7、同一个页面有多个form也不会相互干扰
8、继续沿用了Skygq Jquery 表单验证插件的验证规则
9、Focus提示的样式文件和ajax loading的图片都不用再手动添加,插件会自动添加,插件尽量做到智能化
10、此版本较上个版本,有个很大的改进就是进行ajax无刷新提交的成功之后,loading的图片以及遮罩层物件不需要手动去处理,在插件中都集成了处理。让您可以专注于对返回结果的处理。
11、在进行ajax无刷新提交的时候,整个页面会出现一个半透明的遮罩层已经一个始终居中的ajax-loading的图片,可以让用户感觉到页面是在进行ajax提交的。当然,您也可以选择不出现遮罩层,但是同时ajax loading的图片也不会出现了。
再来看一下这个插件的效果图:

这个插件最大的特点就是在进行ajax无刷新提交的时候,页面上可以出现一个半透明的遮罩将表单域遮盖起来~~很好玩~~
有兴趣的朋友可以去http://www.skygq.com/2011/01/30/skygq-check-ajax-form-1-2/
这里有全部的教程~~还有在线的DEMO演示~~还有完整的代码打包下载~~
hoho~~不好意思~~这个插件暂时还没有将ajax无刷新上传文件整合进来~~
以后有精力的时候,我会考虑将无刷新文件上传弄进来的·~呵呵·
呵呵~~是可以的~~完整的DEMO下载包中有个css文件夹,里面有css文件,如果您是css高手,你可以自己改其中的提示样式~~
我css很菜,就帮不到你了~~
先说一下这个插件的特点
1、将表单验证和ajax表单提交功能和在一起,这是非常方便的,而且功能很强大
2、虽然集成了这么强大的功能,但是代码压缩之后还是非常小的,只有7KB,性能非常优秀
3、很有趣的遮罩层,只会覆盖表单域的范围哦!
4、可以手动的选择是否进行ajax无刷新表单提交,当你选择不进行无刷新表单提交的时候,这款插件就相当于一个表单验证插件。
5、如果您是CSS高手,您也可以对Focus提示的样式进行修改。
6、插件配置插件相对于之前的一个版本要简单多了,调用更加的简单
7、同一个页面有多个form也不会相互干扰
8、继续沿用了Skygq Jquery 表单验证插件的验证规则
9、Focus提示的样式文件和ajax loading的图片都不用再手动添加,插件会自动添加,插件尽量做到智能化
10、此版本较上个版本,有个很大的改进就是进行ajax无刷新提交的成功之后,loading的图片以及遮罩层物件不需要手动去处理,在插件中都集成了处理。让您可以专注于对返回结果的处理。
11、在进行ajax无刷新提交的时候,整个页面会出现一个半透明的遮罩层已经一个始终居中的ajax-loading的图片,可以让用户感觉到页面是在进行ajax提交的。当然,您也可以选择不出现遮罩层,但是同时ajax loading的图片也不会出现了。
再来看一下这个插件的效果图:
这个插件最大的特点就是在进行ajax无刷新提交的时候,页面上可以出现一个半透明的遮罩将表单域遮盖起来~~很好玩~~
有兴趣的朋友可以去http://www.skygq.com/2011/01/30/skygq-check-ajax-form-1-2/
这里有全部的教程~~还有在线的DEMO演示~~还有完整的代码打包下载~~
1 楼
vincent_com
2011-02-18
上班打开JE就看到了.不错
2 楼
kimono
2011-02-18
请问下LZ,是否能够支持ajax上传?
3 楼
guying1028
2011-02-18
可以自定义提示样式吗??
4 楼
sky64566
2011-02-18
kimono 写道
请问下LZ,是否能够支持ajax上传?
hoho~~不好意思~~这个插件暂时还没有将ajax无刷新上传文件整合进来~~
以后有精力的时候,我会考虑将无刷新文件上传弄进来的·~呵呵·
5 楼
sky64566
2011-02-18
guying1028 写道
可以自定义提示样式吗??
呵呵~~是可以的~~完整的DEMO下载包中有个css文件夹,里面有css文件,如果您是css高手,你可以自己改其中的提示样式~~
我css很菜,就帮不到你了~~
6 楼
sky64566
2011-02-22
此插件有更新
http://www.skygq.com/2011/01/30/skygq-check-ajax-form-1-2/
http://www.skygq.com/2011/01/30/skygq-check-ajax-form-1-2/
7 楼
sky64566
2011-03-02
帖子都沉了这么深了呀~~赶紧顶一顶~~
8 楼
sky64566
2011-03-17
此插件已有更新地址为:http://www.skygq.com/2011/03/17/skygq%e8%a1%a8%e5%8d%95%e9%aa%8c%e8%af%81ajax%e6%97%a0%e5%88%b7%e6%96%b0%e8%a1%a8%e5%8d%95%e6%8f%90%e4%ba%a4%e5%90%88%e4%bd%93%e7%89%88%e5%8d%87%e7%ba%a7%e4%b8%ba1-5/
新特性包括:
1、对待input checkbox选择的特殊需求,现在可以做到限制它的选择个数,可以让它只选择几个,或者选择几个到几个之间。
1、对待input text文本域,可以设定输入的值必须在一个区间之内。比如限定输入的年龄在18岁到78岁。
3、新加了一个接口,可以添加验证规则
接口实例如下:
var rules = {
"coupon_amount" : [/^0.([1-9]){1,2}$/,"必须为0.85这样的数字"]
}
$.skygqCheckAjaxForm.addRules(rules);
规则是键值对的形式,“coupon_amount”代表的是验证类型,也就是对应着type参数,后面的数组参数的第一个参数是 验证规则,第二个参数是当表单的内容不符合这个验证规则的时候,提示的信息。
这个对应着的表单初始化信息是这样的:
{ name:"zhekou",type:"coupon_amount",simple:"折扣",focusMsg:"请填写折扣系数"}
表单域的名称可以支持“[”、“]”、“.”这三种特殊符号
新特性包括:
1、对待input checkbox选择的特殊需求,现在可以做到限制它的选择个数,可以让它只选择几个,或者选择几个到几个之间。
1、对待input text文本域,可以设定输入的值必须在一个区间之内。比如限定输入的年龄在18岁到78岁。
3、新加了一个接口,可以添加验证规则
接口实例如下:
var rules = {
"coupon_amount" : [/^0.([1-9]){1,2}$/,"必须为0.85这样的数字"]
}
$.skygqCheckAjaxForm.addRules(rules);
规则是键值对的形式,“coupon_amount”代表的是验证类型,也就是对应着type参数,后面的数组参数的第一个参数是 验证规则,第二个参数是当表单的内容不符合这个验证规则的时候,提示的信息。
这个对应着的表单初始化信息是这样的:
{ name:"zhekou",type:"coupon_amount",simple:"折扣",focusMsg:"请填写折扣系数"}
表单域的名称可以支持“[”、“]”、“.”这三种特殊符号
9 楼
llpllpllp
2011-04-06
楼主的东西不错,希望早日做出能上传的,呵呵
10 楼
janchie
2011-04-07
验证那块用的我写的啊。不过我以前的那个bug有不少,新的还没放到博客上。
呵呵,ajax结合的不错。
呵呵,ajax结合的不错。