jquery插件-表单验证插件-rules

ruels方法

1说明:查看、新增、移除一个表单控件的验证规则

2使用:

  表单控件.rules();

  参数:

    rules()

      返回元素的验证规则

    rules('add',rules)

      增加验证规则

    rules('remove',rules)

      删除验证规则

valid()方法

1、介绍

  检查表单是否验证通过

2、使用

  表单jQuery对象.valid()

增加的选择器

:blank

  选择所有没有值或者值为空白的的表单对象

:filled

  选择所有非空的表单空间,和上面的相反

:unchecked

  选择所有没有被选中的控件,与check选择器相反

  

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>rules</title>
<script type="text/javascript" src="../js/jquery-1.12.1.js"></script>
<script type="text/javascript" src="../js/validation/jquery.validate.js"></script>
<script type="text/javascript" src="../js/validation/messages_zh.js"></script>
<script type="text/javascript"> $(document).ready(function()
{
var validator = $("#form1").validate({
rules: {
field1:{
required:true,
rangelength:[4,6]
}
},
messages:{ field1:{
required:'field1不能为空',
rangelength:'field1的长度必须子{0}与{1}之间'
/*{0}取的是上述属性的第一个值,{1}取的是上述属性的第二个值 */
}
}
});
console.log($('#form1 input:eq(0)').rules());
//操作类型,规则
$("button.add").click(function(){
$('#form1 input:eq(0)').rules('add',{
min:10,
max:2000});
});
$("button.remove").click(function(){
//去掉多条验证规则时用空格隔开
$('#form1 input:eq(0)').rules('remove','rangelength required');
});
//获取表单是否通过
console.log($('#form1').valid());
});
//模板方法,占位符 ///alert(template('小明','皮卡球'))
</script>
<style type="text/css">
form {
margin: 10px 100px 10px 100px;
}
</style>
</head>
<body> <form id="form1"> <div>
field1:<input type="text" name="field1" />
</div> <div>
<input type="submit" name="submit" value="submit"/>
</div>
</form>
<button class="add">rule_add</button>
<button class="remove">rule_remove</button>
</body>
</html>
上一篇:jquery插件-表单验证插件


下一篇:jquery插件-表单验证插件-validator对象