rush:js;">
API简介
1.设置轮播的宽高（默认值都为 auto）
rush:js;">
$("#slides").slidesjs({
width: 700,height: 393
});
2.设置从那张开始（默认值为 1）
rush:js;">
$("#slides").slidesjs({
start: 3 //这里注意数值从1开始，不是0；
默认值0
});
3.设置上下切换按钮
可以自定样式：
4.设置分页切换
可以自定样式：
rush:js;">
$("#slides").slidesjs({
pagination: {
active: true, //
显示或隐藏
分页；
默认值true
effect: "slide" //这里可以设置切换方式，跟上下页切换一样，但是跟上下页不冲突；
默认值slide
}
});
可以自定样式：
rush:js;">
$("#slides").slidesjs({ effect: {
slide: {
speed: 200 //切换花费的时间；
默认值200
},fade: {
speed: 300, //切换花费的时间；
默认值300
crossfade: true //交叉切换，设置为false,会看到背景色；
默认值true
}
}
});
rush:js;">
$("#slides").slidesjs({
callback: {
loaded: function(number) {
//
幻灯片载入完成时
},start: function(number) {
// 切换开始时
},complete: function(number) {
// 切换结束时
}
}
});
validation（表单验证）——官网（
http://jqueryvalidation.org）
以下是针对：jQuery Validation Plugin - v1.15.0 - 2/24/2016 版本
注意：jquery Vaildation Engine 跟以下讲的不是同一款插件
示例：
API
rush:js;">
validate() – Validates 核心
方法
$('#demo').validate({
rules: {
//。。。
},messages: {
//。。。
}
})
valid() – 验证表单是否通过，返回true或false
$('#taojiaqu').validate()
alert($('#taojiaqu').valid());
rules() – 读取、
添加和
删除一个元素的规则
$( "#myinput" ).rules(); //返回
一个规则对象$( "#myinput" ).rules( "add",{
required: true,minlength: 2,messages: {
required: "
required input",minlength: jQuery.validator.format("Please,at least {0} ch
aracters are necessary")
}
});
$( "#myinput" ).rules( "remove" );//移除全部
$( "#myinput" ).rules( "remove","min max" );//移除min max
1.2公共方法
rush:js;">
Validator.form() – 验证表单
Validator.element() – 验证指定的 input
validator.element( "#myselect" );
Validator.resetForm() – 重置表单
Validator.showErrors() –
显示错误信息
Validator.numberOfInvalids() – 返回
错误的字段数
1.3静态方法
rush:js;">
jQuery.validator.addMethod( name,method [,message ] ) –
添加自定义验证
方法
//返回true或falsejQuery.validator.addMethod("domain",function(value,element) {
return this.optional(element) || /^http:\/\/taojiaqu.com/.test(value);
},"
错误信息");
jQuery.validator.format( template,argument,argumentN… ) – 格式化字符串
var format=jQuery.validator.format("{0}--{1}--{2}");
console.log(format("a","b","c")); //a--b--c
jQuery.validator.setDefaults() –
修改默认设置
jQuery.validator.setDefaults({
debug: true //所有的都设置debug模式
});
jQuery.validator.addClassRules() – 统一
添加某个类的 校验规则
//
添加class为name的校验规则：必填，最小长度为2jQuery.validator.addClassRules("name",minlength: 2
});
2.选择器
:blank – 选择value值为空的input
:filled – 选择value有值的input
:unchecked – 选择未被选中的 checkBox
3.验证规则
required – 必填，默认true
remote – 远程请求验证，请求地址返回true或false
minlength – 最小长度，中文字算1个字符
maxlength – 最大长度
rangelength – 给定长度范围，例：[2,5]
min – 最小值，数值型
max – 最大值
range – 给定最大最小取值范围，例：[2,100]
step – 设置步骤
email – 必须是一个邮箱email格式
url – 必须是一个地址url
date – 必须输入正确格式的日期
dateISO – 必须输入正确格式的日期(ISO)，例如：2009-06-23，1998/01/22 只验证格式，不验证有效性
number – 必须输入合法的数字(负数，小数)
digits – 必须输入整数
equalTo：'#abc' – 输入值必须和#abc相同
以下验证规则需加载——additional-methods.min.js
accept – 验证上传的文件mine类型，例：accept："image" ;多种类型逗号（，）隔开
creditcard – 验证信用卡卡号
extension – 验证上传的文件的后缀，例：extension："dll|exe" ;;多种类型逗号（|）隔开
phoneUS – 验证是否为美国号码
require_from_group – 设置类目中有N个是必填项
rush:js;">
mobile_phone: {
require_from_group: [1,".phone-group"] //这边的1表示 三项中只需要填写一项就可以，后面是class名
},home_phone: {
require_from_group: [1,".phone-group"]
},work_phone: {
require_from_group: [1,".phone-group"]
}
4.validate()方法的配置项
debug — 开启关闭debug模式，阻止提交
rush:js;">
$(".selector").validate({
debug: true
});
submitHandler — 通过验证后运行的函数，可以加上表单的提交方法
rush:js;">
$(".selector").validate({
submitHandler: function(form) {
$(form).ajaxSubmit();
}
});
$(".selector").validate({
submitHandler: function(form) {
form.submit();
}
});
invalidHandler — 验证没通过，提交时触发的方法
rush:js;">
$(".selector").validate({
invalidHandler: function(event,validator) {
//event :
自定义事件对象
//validator:当前验证的实例
}
});
ignore — 对某些元素不进行验证
rush:js;">
$("#myform").validate({
ig
nore: ".ig
nore"
});
rules — 定义校验规则，有个隐藏的参数 depends:在满足什么条件下才验证次规则
rush:js;">
$(".selector").validate({
rules: {
name: "
required",email: true
}
}
}); $(".selector").validate({
rules: {
name: ｛ depends：function(element){reruen true;} //返回true的话才校验,name是否必填 ｝,email: {
email: true, min:{ p
aram:15, //单独值的话 用p
aram 代替 depends：function(element){reruen true;} }
}
}
});
messages — 定义提示信息
rush:js;">
$(".selector").validate({
rules: {
name: "
required",email: true
}
},messages: {
name: "请输入您的名字",email: {
required: "请输入的的邮箱",email: "请输入正确的邮箱地址"
}
}
});
groups — 对一组元素的验证，用一个错误提示，用errorPlacement 控制出错信息的位置
rush:js;">
$("#myform").validate({
groups: {
username: "fname lname"
},errorPlacement: function(error,element) {
if (element.attr("name") == "fname" || element.attr("name") == "lname" ) {
error.insertAfter("#lastname");
} else {
error.insertAfter(element);
}
}
});
onsubmit —是否在提交时验证
onfocusout —是否在获取焦点时验证
onkeyup — 是否在敲击键盘时验证
onclick — 是否在鼠标点击数验证
focusInvlid — 提交表单，未通过验证的表单是否获得焦点（默认第一个）
focusCleanup — 提交表单，未通过验证的表单是否移除错误信息
errorClass — 指定错误提示的class类名
validClass — 指定验证通过的class类名
errorElement — 使用什么标记错误标签
rush:js;">
$(".selector").validate({
errorElement: "em"
});
//
错误信息
wrapper — 使用什么标签把上面的errorElement 包起来
errorLableContainer — 把错误信息统一放在一个容器里面
errorContainer — 显示或隐藏验证信息，可以自动实现有错误信息出现时把容器属性变为显示，无错误时隐藏
showErrors — 可以显示总的多少个未通过验证
errorPlacement：function(error,element) — 自定义错误信息的位置,error:错误信息、element：验证的元素
success — 要验证的元素通过验证后的回调
highlight — 可以为未通过的元素加效果
unhighlight — 可以为通过的元素加效果
以上所述是小编给大家介绍的jQuery插件学习教程之SlidesJs轮播+Validation验证。编程之家 jb51.cc 收集整理的教程希望能对你有所帮助，如果觉得编程之家不错，可分享给好友！感谢支持。
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。
