zoukankan      html  css  js  c++  java
  • jQuery.validationEngine前端验证

    引入相关文件:

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.js" type="text/
    javascript"></script>
    <script src="js/jquery.validationEngine-en.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/jquery.validationEngine.js" type="text/javascript" charset="utf-8"></script>
    <link rel="stylesheet" href="css/validationEngine.jquery.css" type="text/css"/>

    使用实例:

    邮箱验证:
    <input value="someone@nowhere.com" class="validate[required,custom[email]]" type="text" name="email" id="email" />
    日期验证:
    <input value="2010-12-01" class="validate[required,custom[date]]" type="text" name="date" id="date" />
    数字验证:
    <input value="too many spaces obviously" class="validate[required,custom[onlyLetterNumber]]" type="text" name="special" id="special" />
    URL验证:
    <input value="http://" class="validate[required,custom[url]] text-input" type="text" name="url" id="url" data-prompt-position="topLeft" />
    必填验证:
    <input value="" class="validate[required] text-input" type="text" name="req" id="req" data-prompt-position="bottomLeft" />
    数字字母验证:
    <input value="too many spaces obviously" class="validate[required,custom[onlyLetterNumber]]" type="text" name="special" id="special" data-prompt-position="bottomRight" />
    自定义验证:
    <input value="" class="validate[required,funcCall[checkHELLO]]" type="text" id="lastname" name="lastname" />
    function checkHELLO(){
       alert('Hello World!');  
    }

    AJAX验证:
    <input value="" class="validate[required,custom[onlyLetterNumber],maxSize[20],ajax[ajaxUserCall]] text-input" type="text" name="user" id="user" />
    "ajaxUserCall": {
        "url": "ajaxValidateFieldUser",
        "extraData": "name=eric",
        "extraDataDynamic": ['#user_id', '#user_email'],
        "alertText": "* This user is already taken",
        "alertTextOk": "All good!",
        "alertTextLoad": "* Validating, please wait"
    },
    多选验证:
    <input class="validate[minCheckbox[2]]" type="checkbox" name="group1" id="maxcheck1" value="5"/>
    <input class="validate[minCheckbox[2]]" type="checkbox" name="group1" id="maxcheck2" value="3"/>
    <input class="validate[minCheckbox[2]]" type="checkbox" name="group1" id="maxcheck3" value="9"/>
  • 相关阅读:
    es6笔记6^_^generator
    es6笔记5^_^set、map、iterator
    es6笔记4^_^function
    es6笔记3^_^object
    关于eslint的使用与配置,以及prettier的使用
    关于查看本机ssh公钥以及生成公钥
    Github上传图片图床
    力扣剑指Offer:39. 数组中出现次数超过一半的数字
    计蒜客:求平均年龄Python方法
    力扣:面试题59. 滑动窗口的最大值Python题解
  • 原文地址:https://www.cnblogs.com/fxfly/p/4642239.html
Copyright © 2011-2022 走看看