表单验证需要 submit 触发
表单提交验证完成时的回调函数(onValidationComplete)
function(form, valid){},参数:
form :表单元素
valid :验证结果( ture or false )
PS :使用此方法后,表单即使验证通过也不会进行提交,交给定义的回调函数进行操作。
submit 触发验证,验证通过后使用
if(confirm("确定保存到系统?")){
$('#form1').submit();
}
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>jQuery Validation Engine 表单验证中文版 » 在线演示 - 前端开发仓库</title>
<link rel="stylesheet" href="http://code.ciaoca.com/css/demo.css">
<link rel="stylesheet" href="http://code.ciaoca.com/jquery/validation_engine/demo/css/validationEngine.jquery.css">
<link rel="stylesheet" href="http://code.ciaoca.com/jquery/validation_engine/demo/css/layout.css">
</head>
<body>
<div class="wrap">
<div class="main">
<div class="inwrap">
<h1>jQuery Validation Engine 表单验证中文版</h1>
<h2>验证回调函数(阻断提交)</h2>
<div class="detail">
<p>使用参数<code>onValidationComplete</code>设置在获得表单验证后,进行的操作。</p>
<p>使用此方法后,表单即使验证通过也不会进行提交,交给定义的回调函数进行操作。</p>
</div>
<div class="example">
<form id="formID2" class="formular" method="post" action="">
<fieldset>
<legend>Phone</legend>
<div class="tips">
<p>手机号格式示例:</p>
<ul>
<li>+103-304-340-4300-043</li>
<li>+1 305 768 23 34 ext 23</li>
<li>+1 (305) 768-2334 extension 703</li>
<li>+1 (305) 768-2334 x703</li>
<li>04312 / 777 777</li>
<li>01-47.34/32 56</li>
<li>(01865) 123456</li>
</ul>
</div>
<input value="+1 305 768 23 34 ext 23 BUG" class="validate[required,custom[phone]] text-input" type="text" name="telephone" id="telephone">
</fieldset>
<fieldset>
<legend>OnlyLetter</legend>
<div class="tips">只能输入 a-z 、 A-Z 、空格和单引号(')</div>
<input value="this is an invalid char '.'" class="validate[required,custom[onlyLetterSp]] text-input" type="text" name="onlyascii" id="onlyascii">
</fieldset>
<input class="submit" type="submit" value="验证 & 提交表单">
</form>
</div>
</div>
</div>
</div>
<script src="http://code.ciaoca.com/js/jquery-1.7.2.min.js"></script>
<script src="http://code.ciaoca.com/jquery/validation_engine/demo/js/languages/jquery.validationEngine-zh-CN.js"></script>
<script src="http://code.ciaoca.com/jquery/validation_engine/demo/js/jquery.validationEngine.min.js"></script>
<script>
jQuery(document).ready(function(){
jQuery('#formID2').validationEngine('attach', {
onValidationComplete: function(form, status){
//alert('表单是否验证通过?结果:' + status + ',表单不会提交。');
if(status){
if(confirm("确定保存到系统?")){
form.submit();
}
}
}
});
});
</script>
</body>
</html>
这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。
V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。
V2EX is a community of developers, designers and creative people.