zoukankan      html  css  js  c++  java
  • 使用jquery-validationEngine框架,4步实现前端JS校验

    第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/   
  • 相关阅读:
    个人工作总结2
    个人工作总结1
    《梦断代码》阅读笔记01
    构建之法阅读笔记4
    四则运算-安卓版
    最大联通子数组之和(dfs,记忆化搜索,状态压缩)
    第五周进度报告
    第四周进度报告
    最大子数列之和问题
    构建之法阅读笔记3
  • 原文地址:https://www.cnblogs.com/qitian1/p/6462807.html
Copyright © 2011-2022 走看看