1、导入js
<script type="text/javascript" src="./script/jquery/jquery.js">
</script>
<script type="text/javascript"src="./script/jquery/jquery.validate.js">
</script>
<script type="text/javascript"
src="./script/jquery/jquery.messages_cn.js">
</script>
<script type="text/javascript"
src="./script/jquery/jquery.metadata.js">
</script>
<script type="text/javascript">
$().ready(function() {
$("#signupForm").validate();
jQuery.validator.addMethod("mobile", function(value, element) {
var length = value.length;
var mobile = /^(((13[0-9]{1})|(15[0-9]{1}))+\d{8})$/
return this.optional(element) || (length == 11 && mobile.test(value));
}, "手机号码格式错误");
});
</script>
2、在form表单,每个要验证的 属性上加 class声明
<form id="signupForm" action=""">
<ul>
<li>
<span>电子邮箱:</span>
<input type="text" id="email" class="required email" />
<span id="emailMsg"></span>
</li>
<li>
<span>手机号码:</span>
<input type="text" id="phoneNum" class="required mobile" />
<span id="phonenumMsg"></span>
</li>
<li>
<span>设置密码:</span>
<input type="password" id="password"
class="{required:true,minlength:5}" />
<span id="passwordMsg"></span>
</li>
<li>
<span>确认密码:</span>
<input type="password" id="confirm"
class="{required:true,minlength:5,equalTo:'#password'}" />
<span id="confirmMsg"></span>
</li>
<li>
<span>验证码:</span>
<span id="cc" style="font-size: small;"></span>
<input style="width: 100px;" type="text" id="checkCode" />
<span style="cursor: pointer;" onclick="getCheckCode()">换一题</span>
<span id="checkCodeMsg"></span>
</li>
<!--<li><span> </span><input class="tj" type="submit" onclick="register()" value=""/></li>
-->
<li>
<span> </span>
<input class="tj" type="submit" value="" />
</li>
<li>
<span> </span>
<div>
点击立即注册,即表示同意并遵守拼趣网的
<a href="yhxy.html">用户协议 </a>和
<a href="yszc.html">隐私政策</a>
</div>
</li>
</ul>
</form>
3、jquery.messages_cn.js内容
jQuery.extend(jQuery.validator.messages, {
required: "必选字段",
remote: "请修正该字段",
email: "请输入正确格式的电子邮件",
url: "请输入合法的网址",
date: "请输入合法的日期",
dateISO: "请输入合法的日期 (ISO).",
number: "请输入合法的数字",
digits: "只能输入整数",
creditcard: "请输入合法的信用卡号",
equalTo: "请再次输入相同的值",
accept: "请输入拥有合法后缀名的字符串",
maxlength: jQuery.format("请输入一个长度最多是 {0} 的字符串"),
minlength: jQuery.format("请输入一个长度最少是 {0} 的字符串"),
rangelength: jQuery.format("请输入一个长度介于 {0} 和 {1} 之间的字符串"),
range: jQuery.format("请输入一个介于 {0} 和 {1} 之间的值"),
max: jQuery.format("请输入一个最大为 {0} 的值"),
min: jQuery.format("请输入一个最小为 {0} 的值")
});
分享到:
相关推荐
JQuery核心文件,JQuery的validate校验文件,validate校验messages_zh中文文件
jQuery Validate 插件依赖 jQuery 库,使用前需要先导入 jQuery的 js 文件,再导入 jquery.validate.js 插件,可以再导入中文提示信息文件 messages_zh.js
这个前端的jquery的表单校验插件,使用起来很方便,可以大大的减少我们开发者对于表单校验的工作。而且支持自定义验证规则,功能强大。
日期校验 ie6 出错,慎用。 6 dateISO:true 必须输入正确格式的日期(ISO),例如:2009-06-23,1998/01/22。只验证格式,不验证有效性。 7 number:true 必须输入合法的数字(负数,小数)。 8 digits:true 必须输入...
validate自动校验源码 博文链接:https://jianglanlan.iteye.com/blog/1856659
//验证身份证号码 jQuery.validator.addMethod("idCardNo", function (value, element) { //验证身份证号方法 var testIdCardNo = function (idcard) { ...jquery.validate的扩展校验身份证的方法。
jQuery的表单校验插件validate
jquery.validate表单验证密码完整例子(带密码强度显示)
本资源是jquery validation插件的相关文件,包括了四个文件:jquery-1.6.4.js ,jquery.metadata.js ,jquery.validate.js ,jquery.validate.messages_cn.js
jquery.validate插件remote规则相同值不验证的问题解决办法.方法绝对有效
NULL 博文链接:https://a-alter.iteye.com/blog/1149470
引入页面的时候,引入: ... ${request.contextPath}/js/common/plug/jquery/jquery.validate.min.js"> ${request.contextPath}/js/common/plug/jquery/jquery.validate.expand.js"> 把标题正确引入即可使用
主要介绍了jQuery Validate 校验多个相同name的方法,需要的朋友可以参考下
java使用jquery_validate插件实现文本校验,各种校验,比较全,其中有个extension.js文件,是自己扩展后的
jquery validate有很多验证规则,但是更多的时候,需要根据特定的情况进行自定义验证规则。 这里就来聊一聊jquery validate的自定义验证。 jquery validate有一个方法,可以让用户来自定义验证规则。 案例一: 代码...
修改validate的remote校验,支持处理返回格式{success:false,message:"提示消息"}
jquery.validate表单验证框架详解.
目录表单校验插件1. 导入插件2. 基础语法3. 常用校验规则4. 校验案例a. 主要需求b.... 表单校验插件 jQuery Validate 插件为表单提供了...jQuery Validate 插件依赖 jQuery 库,使用前需要先导入 jQuery的 js 文件,再导入
jquery-validate 可对前端form进行表单校验,文档里详细介绍了如何使用jquery-validate框架和如何扩展验证方法。