首頁 > 軟體

最新JS正規表示式驗證郵箱和手機號範例(2022)

2022-08-04 18:01:40

驗證郵箱的正規表示式:

const regEmail = /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(.[a-zA-Z0-9_-])+/

或 

const regEmail = /^([a-zA-Z]|[0-9])(w|-)+@[a-zA-Z0-9]+.([a-zA-Z]{2,4})$/

驗證手機號的正規表示式:

const regMobile = /^(0|86|17951)?(13[0-9]|15[012356789]|17[678]|18[0-9]|14[57])[0-9]{8}$/

  data() {
    // 驗證郵箱的規則
    var checkEmail = (rule, value, cb) => {
      //  驗證郵箱的正規表示式
      const regEmail = /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(.[a-zA-Z0-9_-])+/
      if (regEmail.test(value)) {
        // 合法郵箱
        return cb()
      }
      cb(new Error('請輸入合法的郵箱'))
    }
    // 驗證手機號的規則
    var checkMobile = (rule, value, cb) => {
      //  驗證手機號的正規表示式
      const regMobile =
        /^(0|86|17951)?(13[0-9]|15[012356789]|17[678]|18[0-9]|14[57])[0-9]{8}$/
      if (regMobile.test(value)) {
        // 合法手機號
        return cb()
      }
      cb(new Error('請輸入合法的手機號'))
    }
    return {
      // 新增表單的驗證規則物件
      addFormRules: {
        email: [
          { required: true, message: '請輸入郵箱', trigger: 'blur' },
          { validator: checkEmail, trigger: 'blur' },
        ],
        mobile: [
          { required: true, message: '請輸入手機', trigger: 'blur' },
          { validator: checkMobile, trigger: 'blur' }
        ]
      }
    }
  }

 不合法的提示:

合法的:

rules的另一個用法:

 pattern

  data() {
    return {
      // 新增表單的驗證規則物件
      addFormRules: {
        email: [
          { required: true, message: '請輸入郵箱', trigger: 'blur' },
          { pattern: /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(.[a-zA-Z0-9_-])+/, message: '請輸入合法的郵箱', trigger: 'blur' },
        ],
        mobile: [
          { required: true, message: '請輸入手機', trigger: 'blur' },
          { pattern: /^(0|86|17951)?(13[0-9]|15[012356789]|17[678]|18[0-9]|14[57])[0-9]{8}$/, message: '請輸入合法的手機號', trigger: 'blur' },
        ]
      }
    }
  }

補充:整理了一些最近自己常用的正規表示式,希望能對大家有所幫助!

/* 合法uri */
export function validateURL(textval) {
 const urlregex = /^(?:http(s)?://)?[w.-]+(?:.[w.-]+)+[w-._~:/?#[]@!$&'*+,;=.]+$/
 return urlregex.test(textval)
}
/* 小寫字母 */
export function validateLowerCase(str) {
 const reg = /^[a-z]+$/
 return reg.test(str)
}
/* 大寫字母 */
export function validateUpperCase(str) {
 const reg = /^[A-Z]+$/
 return reg.test(str)
}
/* 大小寫字母 */
export function validateAlphabets(str) {
 const reg = /^[A-Za-z]+$/
 return reg.test(str)
}
/* 市場售價 */
export function validatePrice(str) {
 const reg = /(^[1-9]d*(.d{1,2})?$)|(^0(.d{1,2})?$)/
 return reg.test(str)
}
/* 庫存預警值 匹配非負整數(正整數 + 0) */
export function validatestockWarn(str) {
 const reg = /^(0|[1-9][0-9]*)$/
 return reg.test(str)
}
/* 比價網站 只驗證京東和蘇寧網站 */
export function validateCompareWebsite(str) {
 const reg = /^((https://[0-9a-zA-Z_]+.|http://[0-9a-zA-Z_]+.|https://|http://)|([0-9a-zA-Z_]+.){0,1})(jd|suning).(com$|com/[S]*)/i
 return reg.test(str)
}
/* 固定電話 */
export function validateTelephone(str) {
 const reg = /^((d{3,4})|d{3,4}-|s)?d{7,14}$/
 return reg.test(str)
}
/* 手機號碼 */
export function validatePhoneNumber(str) {
 const reg = /^[1][3,4,5,6,7,8,9][0-9]{9}$/
 return reg.test(str)
}
/* 手機號碼和固定電話 */
export function validatePhTelNumber(str) {
 const reg = /^((0d{2,3}-d{7,8})|(1[3456789]d{9}))$/
 return reg.test(str)
}
/* 電子郵箱 */
export function validateEmail(str) {
 const reg = /^[A-Za-z0-9u4e00-u9fa5]+@[a-zA-Z0-9_-]+(.[a-zA-Z0-9_-]+)+$/
 return reg.test(str)
}
/* 郵編 */
export function validateZipCode(str) {
 const reg = /^[1-9][0-9]{5}$/
 return reg.test(str)
}
/* 身份證 */
export function validateIDCard(str) {
 const reg = /(^d{15}$)|(^d{18}$)|(^d{17}(d|X|x)$)/
 return reg.test(str)
}
/* 銀行卡號 15位或者16位元或者19位 */
export function validateBank(str) {
 const reg = /^([1-9]{1})(d{14}|d{18}|d{15})$/
 return reg.test(str)
}
/* 納稅人識別碼 */
export function validateTaxpayer(str) {
 const reg = /^([1-9]{1})(d{14}|d{18}|d{15})$/
 return reg.test(str)
}
/* 匹配全空格 */
export function validateAllBlank(str) {
 const reg = /^s+$/gi
 return reg.test(str)
}

總結

到此這篇關於最新JS正規表示式驗證郵箱和手機號的文章就介紹到這了,更多相關JS正則驗證郵箱手機號內容請搜尋it145.com以前的文章或繼續瀏覽下面的相關文章希望大家以後多多支援it145.com!


IT145.com E-mail:sddin#qq.com