Layui自定義驗證規則（Layui自定義固話驗證，支持五位數的座機如12306）

0 前言

在開發中，我們經常需要對一些輸入數據通過正則表達式進行有效性驗證，基於Layui框架開發下，Layui框架本身已經集成了一些基礎的驗證，這對我們在前端驗證輸入的有效性非常便捷，如我們需要驗證郵箱的話，可以直接在該input域添加 lay-verify=” email”，這樣該input域就會驗證郵箱的有效性。目前Layui支持的驗證規則有：required（必填項）；phone（手機號）；email（郵箱）；url（網址）；number（數字）；date（日期）；identity（身份證），同時他也支持多組合驗證，詳細見圖：

 

（https://www.layui.com/doc/modules/form.html）

此外，我們還會遇到一些自定義的驗證需求，如我們驗證固定電話號碼有效性，上面基礎的驗證需求滿足不了項目的實際需求，需要我們重新自定義驗證規則，然後適配到控件中。

Layui是支持我們自己定義並編寫正則表達式驗證有效性需求的，詳細可以查看https://www.layui.com/doc/modules/form.html#verify。本文下面將通過自定義驗證固話的規則演示。

1 自定義固定電話驗證規則

（1）定義驗證規則

如果我們需要自定義驗證規則

// 驗證規則  form.verify表單驗證定義
form.verify({
	//telnumber驗證規則的定義
	telnumber: [
		/^((0\d{2,3})-)?(\d{5,8})(-(\d{3,}))?$/       // 這部分爲驗證正則表達式-固話驗證正則表達式
		,'請輸入正確的座機號碼'                       // 這部分是不符合驗證規則提示的錯誤信息
	]
});

（2）控件應用，當你自定義了類似上面的驗證規則後，你只需要把 key（這個key就是定義驗證規則名稱，如上文的telnumber） 賦值給輸入框的 lay-verify 屬性即可生效

<input type="text" lay-verify=" telnumber " placeholder="請輸入固話">