首页 > Web开发 > 详细

使用jquery-validationEngine框架,4步实现前端JS校验

时间:2015-03-25 23:36:43      阅读:400      评论:0      收藏:0      [点我收藏+]
第1步:

   引入CSS和JS
   
   
<script type="text/javascript"
src="${base}/static/js/frontbackend.js?fv=${fv}"></script>
<script src="${static}/framework/validationEngine/jquery.validationEngine-zh_CN.js" type="text/javascript"></script>
<script src="${static}/framework/validationEngine/jquery.validationEngine.js" type="text/javascript"></script>

第2步:
   
     定义form

   
<form id="addForm" class="validationEngine">
  <input type="text" name="card" id="card"
class="i-inp validate[required,custom[bankCard]]" />
</form>

   form有id和class至少2个属性。
   input输入框有validate校验样式。

第3步:
   页面加载完毕之后,启动配置。
  
$(function(){
//验证
$(".validationEngine").each(function() {
$(this).validationEngine(‘attach‘, {
promptPosition : ‘centerRight‘,
scroll : false
});
});
});

   有了上面的代码,鼠标离开输入框后,就会验证。

第4步:
   提交之前,验证。
  
var pass=$("#addForm").validationEngine(‘validate‘);
if(!pass){
return;
}

总结:网上关于validationEngine的参考资料很多,但大部分不怎么的,最简单实用的其中1个是下面写的。
最困扰我的是,第3步。
鼠标离开输入框后,自动验证,给出提示。

更多用法,再说吧。

参考资料:
http://code.ciaoca.com/jquery/validation_engine/   

使用jquery-validationEngine框架,4步实现前端JS校验

原文:http://blog.csdn.net/fansunion/article/details/44629705

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!