# validator表單驗證 官方<https://github.com/jaywcjlove/validator.js> ``` <pre class="calibre14">``` var validator <span class="token">=</span> <span class="token5">new</span> <span class="token1">Validator</span><span class="token2">(</span><span class="token4">'form1'</span><span class="token2">,</span><span class="token2">[</span> <span class="token2">{</span> name<span class="token2">:</span> <span class="token4">'openid'</span><span class="token2">,</span> display<span class="token2">:</span><span class="token4">"不能為空|必須正數"</span><span class="token2">,</span> regexp_num<span class="token2">:</span><span class="token">/</span><span class="token">^</span><span class="token2">[</span><span class="token3">0</span><span class="token">-</span><span class="token3">9</span><span class="token2">]</span><span class="token">+</span>$<span class="token">/</span><span class="token2">,</span> rules<span class="token2">:</span> <span class="token4">'required|regexp_num'</span> <span class="token2">}</span> <span class="token2">]</span><span class="token2">,</span><span class="token5">function</span><span class="token2">(</span>obj<span class="token2">,</span>evt<span class="token2">)</span><span class="token2">{</span> <span class="token5">if</span><span class="token2">(</span>obj<span class="token2">.</span>errors<span class="token2">.</span>length<span class="token">></span><span class="token3">0</span><span class="token2">)</span><span class="token2">{</span> var error_str <span class="token">=</span> <span class="token4">''</span><span class="token2">;</span> <span class="token5">for</span> <span class="token2">(</span>var i <span class="token">=</span> <span class="token3">0</span><span class="token2">;</span> i <span class="token"><</span> obj<span class="token2">.</span>errors<span class="token2">.</span>length<span class="token2">;</span> i<span class="token">++</span><span class="token2">)</span> <span class="token2">{</span> error_str <span class="token">=</span>obj<span class="token2">.</span>errors<span class="token2">[</span>i<span class="token2">]</span><span class="token2">.</span>message<span class="token2">;</span> obj<span class="token2">.</span>errors<span class="token2">[</span>i<span class="token2">]</span><span class="token2">.</span>element<span class="token2">.</span><span class="token1">setAttribute</span><span class="token2">(</span><span class="token4">'style'</span><span class="token2">,</span> <span class="token4">'border:1px solid red'</span><span class="token2">)</span> <span class="token1">alert</span><span class="token2">(</span>error_str<span class="token2">)</span><span class="token2">;</span><span class="token5">return</span> <span class="token3">false</span><span class="token2">;</span> <span class="token2">}</span> <span class="token2">}</span> <span class="token2">}</span><span class="token2">)</span> validator<span class="token2">.</span><span class="token1">validate</span><span class="token2">(</span><span class="token2">)</span><span class="token2">;</span><span class="token6">//驗證失去焦點</span> ``` ``` - `name` -> input 中 `name` 對應的值 - `display` -> 驗證錯誤要提示的文字 `{{這個中間是name對應的值}}` - `rules` -> 一個或多個規則(中間用`|`間隔) - `is_email` -> 驗證合法郵箱 - `is_ip` -> 驗證合法 ip 地址 - `is_fax` -> 驗證傳真 - `is_tel` -> 驗證座機 - `is_phone` -> 驗證手機 - `is_url` -> 驗證URL - `is_money` -> 金額格式驗證 - `is_english` -> 字母驗證 - `is_chinese` -> 中文驗證 - `is_percent` -> 驗證百分比 - `required` -> 是否為必填 - `max_length` -> 最大字符長度 - `min_length` -> 最小字符長度 - `same(field)` -> 指定字段內容是否相同 - `different(field)` -> 拒絕與某個字段相等,比如登錄密碼與交易密碼情況 - `contains(field)` -> 直接判斷字符串是否相等 - `accepted(field)` -> 用于服務條款,是否同意時相當有用,不限制checkbox與radio,有可能submit button直接附帶value情況 ``` <pre class="calibre16">``` <span class="token2">{</span> <span class="token6">//name 字段</span> name<span class="token2">:</span> <span class="token4">'email'</span><span class="token2">,</span> display<span class="token2">:</span><span class="token4">"你輸入的不{{email}}是合法郵箱|不能為空|太長|太短"</span><span class="token2">,</span> <span class="token6">// 驗證條件</span> rules<span class="token2">:</span> <span class="token4">'is_email|max_length(12)'</span> <span class="token6">// rules: 'valid_email|required|max_length(12)|min_length(2)'</span> <span class="token2">}</span> ``` ```