判斷輸入的字符是否為整數(包含整數格式驗證)

在項目中,很多時候都會有輸入框的存在,為了防止用戶隨意輸入都會有限制,最近遇到一種需求,輸入價格時只能輸入數字類型,並且輸入的數字格式要正確,

 

在網上搜索的很多驗證數字的對格式沒有校驗,所以自己就完善了一下,使用的正則表達式,但是由於自己正則知識實在匱乏,寫的比較low,不過也能實現最終的效果吧

 

能通過驗證的數字類型: 0.9, 1, 20....

 

不能通過驗證的數字: 00.9, 0, 09, 99., 其他包含字母,標點符號的字符串

 

項目里的輸入框是用的element的form表單,form表單自帶驗證規則,我這個是寫在自定義驗證規則里的,不過修改一下也可以單獨使用

 

var checkPrice = (rule, value, callback) => {
  let zero = /^0+\d*$/ // 過濾以0開頭的數據(不含小數點)
  let dublue = /^0{2,}\.\d+$/ // 過濾小數點前有兩個以上0的數字
  let point = /^\d+\.?\d+$/ //  以數字開頭,可以允許出現一次或0次小數點,以數字結尾(這里的數字必須有兩個)
  let reg = /^[1-9]{1}$/ // 匹配只有一個數字的情況
  if (!value) {
    callback(new Error('Please enter the unit price'))
  }
  setTimeout(() => {
    if (zero.test(value) || dublue.test(value)) { // 首先過濾掉錯誤的數據
      callback(new Error('Enter the correct number format')) // 調取輸入框驗證的方法
    } else if (point.test(value) || reg.test(value)) { // 匹配數據,如果輸入的數字只有一位數時用reg匹配
      callback() // 驗證通過
    } else {
      callback(new Error('Enter the correct number format'))
    }
  }, 100)
}

也可以寫成一個函數使用

function checkPrice (value) {
  let zero = /^0+\d*$/ // 過濾以0開頭的數據(不含小數點)
  let dublue = /^0{2,}\.\d+$/ // 過濾小數點前有兩個以上0的數字
  let point = /^\d+\.?\d+$/ //  以數字開頭,可以允許出現一次或0次小數點,以數字結尾(這里的數字必須有兩個)
  let reg = /^[1-9]{1}$/ // 匹配只有一個數字的情況
  if (!value) {
    return false
  }
  if (zero.test(value) || dublue.test(value)) { // 首先過濾掉錯誤的數據
    return false
  } else if (point.test(value) || reg.test(value)) { // 匹配數據,如果輸入的數字只有一位數時用reg匹配
    return true
  } else {
    return false
  }
}

使用效果

因為對正則也是一知半解,所以寫得很重復,如果有優化意見希望能告知(*^▽^*)