js正規表示式驗證手機，郵箱，身份證

一. 簡述

判斷輸入手機號，郵箱，身份證是否合法。

二. 方法

<input id="id" type="text" placeholder="請輸入投保人證件號碼" class="section-input" size="18" 
                   onchange="isIdAvailable(this.value)"/>
<input id="phone"  type="number" placeholder="請輸入投保人手機號" class="section-input"
                   oninput="if(value.length>11)value=value.slice(0,11)" pattern="[0-9]*"
                   onchange="isPoneAvailable(this.value)"/>
<input id="email"  type="email" placeholder="請輸入投保人郵箱以便獲取電子保單" class="section-input"
                   onchange="isEmailAvailable(this.value)"/>

<script>
    var myreg = /^[1][3,4,5,7,8][0-9]{9}$/;
    var myid = /^(\d{6})(\d{4})(\d{2})(\d{2})(\d{3})([0-9]|X)$/;
    var myemail = /[\w!#$%&'*+/=?^_`{|}~-]+(?:\.[\w!#$%&'*+/=?^_`{|}~-]+)*@(?:[\w](?:[\w-]*[\w])?\.)+[\w](?:[\w-]*[\w])?/;
    /**
     * onchange：input框失去焦點的時候觸發該事件
     * @param str
     * @returns {boolean}
     */
    function isPoneAvailable(str) {
        if (!myreg.test(str)) {
            layer.msg('手機號不合法');
            return false;
        } else {
            return true;
        }
    }
    /**
     * 驗證身份證
     * @param str
     */
    function isIdAvailable(str) {
        if (!myid.test(str)) {
            layer.msg('身份證不合法');
            return false;
        } else {
            return true;
        }
    }
    /**
     * 驗證郵箱
     * @param str
     */
    function isEmailAvailable(str) {
        if (!myemail.test(str)) {
            layer.msg('郵箱不合法');
            return false;
        } else {
            return true;
        }
    }
</script>

onchang：監聽輸入值的改變，不是實時監聽變化的，而是失去焦點的時候，執行這個方法。