verJs實(shí)用的表單驗(yàn)證插件

使用方法：

verjs是一款原生js代碼編寫的表單驗(yàn)證插件，提供了常用的10種表單驗(yàn)證方式，包括身份證號(hào)碼驗(yàn)證、手機(jī)電話號(hào)碼、電子郵箱驗(yàn)證、必填字段驗(yàn)證、正則自定義驗(yàn)證、多次對(duì)比驗(yàn)證、最大值/最小值驗(yàn)證等表單驗(yàn)證功能。

1、head引入js文件

<script src="verJs/verJs.min.js"></script>

2、body引入HTML代碼

<form action="#" id="form" data-form="ajax">
    <fieldset>
        <div>form表單驗(yàn)證</div>
        <dl>
            <dt>密碼</dt>
            <dd>
                <input type="text" data-required="參數(shù)不能為空" id="eq">
            </dd>
        </dl>
        <dl>
            <dt>確認(rèn)密碼</dt>
            <dd>
                <input type="text" data-equal="#eq" data-required="參數(shù)不能為空">
            </dd>
        </dl>
        <dl>
            <dt>最小/大值</dt>
            <dd>
                <input type="number" data-min="7" data-max="15">
            </dd>
        </dl>
        <dl>
            <dt>最小/大長度</dt>
            <dd>
                <input type="text" data-minlength="5" data-maxlength="15">
            </dd>
        </dl>
        <dl>
            <dt>手機(jī)</dt>
            <dd>
                <input type="text" data-mobile="true">
            </dd>
        </dl>
        <dl>
            <dt>郵箱</dt>
            <dd>
                <input type="text" data-email="true">
            </dd>
        </dl>
        <dl>
            <dt>身份證</dt>
            <dd>
                <input type="text" data-idcard="true">
            </dd>
        </dl>
        <dl>
            <dt>氣泡+正則</dt>
            <dd>
                <input type="text" data-rule="^[A-Za-z]\w{5,11}$" data-rule-message="請(qǐng)輸入6~12字符，以字母開頭" data-required="請(qǐng)輸入6~12字符，以字母開頭" data-block="true">
            </dd>
        </dl>

        <button type="submit">提交</button>
    </fieldset>
</form>

<script>
    new VerJs({
        form:"#form",
        success:function (d) {
            alert(1)
        },
        fail:function (d) {
            alert(2)
        }
    });
</script>