温馨提示×

温馨提示×

您好,登录后才能下订单哦!

密码登录×
登录注册×
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》

jQuery Validation Plugin

发布时间:2020-07-21 12:17:29 来源:网络 阅读:285 作者:antlove 栏目:web开发

index.html

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="jquery-1.9.0.js"></script>
<script type="text/javascript" src="jquery.validate.min.js"></script>

<script type="text/javascript">
    // add the customized method 
	$.validator.addMethod("test",function(value,element,params){
		var flag = false;
		if(typeof(value)!=null&&parseInt(value)>10){
			flag = true;
		}
		return this.optional(element) || flag;
	},"the input value must be larger that 10");


	$(function(){
		$("#form").validate({
            submitHandler: function(form) {
                alert("pass ... ");
            },
            rules: {
                username: {
                    required:true
                },
                password:{
                	required:true,
                	minlength:6
                },
                email:{
                	required:true,
                	email:true
                },
                testField:{
                	required:true,
                	test:true
                }
            },
            messages: {
                username: {
                    required:"please input the username"
                },
                password:{
                	required:"please input the password",
                	minlength:"the password must be six characters at least"
                },
                email:{
                	required:"please input the email",
                	email:"the email format is wrong!"
                },
                testField:{
                	required:"please input the testField",
                }

            }//end messages
        });
	});
</script>
</head>
<body>
	<form id="form">
		<div>
			<label>username</label>
			<input name="username" type="text" />
		</div>
		<div>
			<label>password</label>
			<input name="password" type="text" />
		</div>
		<div>
			<label>email</label>
			<input name="email" type="text" />
		</div>
		<div>
			<label>test field</label>
			<input name="testField" type="text" />
		</div>
		<div>
			<input type="submit" value="submit" />
		</div>
	</form>
</body>
</html>


附件:http://down.51cto.com/data/2365952
向AI问一下细节

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

AI