jquery.validate.js 点击确认按钮验证无效
页面引用了jquery.validate.js,但是点击确认按钮验证无效,如图:

<div class="change_mobile">
<form method="post" novalidate="novalidate" id="change_mobile">
<h2>更换手机<i></i></h2>
<div class="change">
<div class="change_con">
<ul>
<li class="l0"><label class="la2"></label><input type="text" placeholder="图片码" name="code"><i><img src="images/pic21.png"></i></li>
<li class="l0"><label class="la1"></label><input type="text" placeholder="手机号" name="userName"><div class="div_0" id="sendMobileCode">获取短信验证码</div></li>
<li><label class="la4"></label><input type="text" placeholder="验证码" name="phoneCode"></li>
<li class="border_none"><span>请查收你手机短信,并输入短信中的验证码</span></li>
<li><input type="submit" class="btn0" value="确认"></li>
</ul>
</div>
</div>
</form>
</div>
<script>
$(document).ready(function () {
//更换手机验证提示
$("#change_mobile").validate({
rules: {
userName: {
required: true,
digits: true,
rangelength: [11, 11],
//url:"",
//date:function()
//{
// //参数
//}
},
code: {
required: true
},
phoneCode: {
required: true
},
},
messages: {
userName: {
required: "<span class='error'>手机号错误,请重新输入</span>",
digits: "<span class='error'>手机号错误,请重新输入</span>",
rangelength: "<span class='error'>手机号错误,请重新输入</span>"
},
code: {
required: "<span class='error'>请输入验证码</span>"
},
phoneCode: {
required: "<span class='error'>密码格式输入错误,请重新输入</span>"
},
},
//debug: true,
success: function (label) {
label.html("<span class='success'></span>");
},
errorPlacement: function (error, element) {
if (element.context.name === "VerifiCode") {
error.insertAfter(element.next("a"));
}
else {
element.next().remove();
error.insertAfter(element);
}
}
});
//获取验证码
$("#sendMobileCode").click(function () {
timer(this);
});
var wait = 120;
var timer = function (e) {
if (wait == 0) {
e.innerText = "重新获取验证码";
wait = 120;
$(e).bind('click', function () { timer(e) });
}
else {
$(e).unbind('click');
e.innerText = wait + "秒后重新获取";
wait--;
setTimeout(function () {
timer(e);
},
1000);
}
};
});
</script>

<div class="change_mobile">
<form method="post" novalidate="novalidate" id="change_mobile">
<h2>更换手机<i></i></h2>
<div class="change">
<div class="change_con">
<ul>
<li class="l0"><label class="la2"></label><input type="text" placeholder="图片码" name="code"><i><img src="images/pic21.png"></i></li>
<li class="l0"><label class="la1"></label><input type="text" placeholder="手机号" name="userName"><div class="div_0" id="sendMobileCode">获取短信验证码</div></li>
<li><label class="la4"></label><input type="text" placeholder="验证码" name="phoneCode"></li>
<li class="border_none"><span>请查收你手机短信,并输入短信中的验证码</span></li>
<li><input type="submit" class="btn0" value="确认"></li>
</ul>
</div>
</div>
</form>
</div>
<script>
$(document).ready(function () {
//更换手机验证提示
$("#change_mobile").validate({
rules: {
userName: {
required: true,
digits: true,
rangelength: [11, 11],
//url:"",
//date:function()
//{
// //参数
//}
},
code: {
required: true
},
phoneCode: {
required: true
},
},
messages: {
userName: {
required: "<span class='error'>手机号错误,请重新输入</span>",
digits: "<span class='error'>手机号错误,请重新输入</span>",
rangelength: "<span class='error'>手机号错误,请重新输入</span>"
},
code: {
required: "<span class='error'>请输入验证码</span>"
},
phoneCode: {
required: "<span class='error'>密码格式输入错误,请重新输入</span>"
},
},
//debug: true,
success: function (label) {
label.html("<span class='success'></span>");
},
errorPlacement: function (error, element) {
if (element.context.name === "VerifiCode") {
error.insertAfter(element.next("a"));
}
else {
element.next().remove();
error.insertAfter(element);
}
}
});
//获取验证码
$("#sendMobileCode").click(function () {
timer(this);
});
var wait = 120;
var timer = function (e) {
if (wait == 0) {
e.innerText = "重新获取验证码";
wait = 120;
$(e).bind('click', function () { timer(e) });
}
else {
$(e).unbind('click');
e.innerText = wait + "秒后重新获取";
wait--;
setTimeout(function () {
timer(e);
},
1000);
}
};
});
</script>
...全文
相关推荐
jQuery表单验证、弹出层、日历插件例子
NULL 博文链接:https://xj19891016.iteye.com/blog/850331
深入探索jQuery Validate自定义验证样式
jQuery是一个快速、小巧、功能丰富的JavaScript库,它简化了HTML文档遍历、事件处理、动画和Ajax交互等操作。jQuery Validate是一个强大的表单验证插件,为开发者提供了灵活、易于定制的验证规则,可以轻松集成到任何基于jQuery的项目中。错误消息是表单验证过程中不可或缺的组成部分。它们不仅通知用户输入数据的无效性,还指导用户如何纠正错误。错误消息的类型可以根据它们的作用和出现的时机来区分。常见的错误消息类型包括即时验证消息、提交验证消息和动态生成消息。
jQuery.validate.js
jQuery.validate.js 组件,可以使用,绝对好资源!!!
jquery-validate的验证的js文件
提供jquery验证插件的专用js文件,包括jquery.js、jquery.validation.js、jquery.metadata.js,满足使用jquery-validate插件的需求
jQuery validate 验证radio实例
主要介绍了jQuery validate 验证radio实例代码,非常不错,具有参考借鉴价值,需要的朋友可以参考下


