大家看到這段**有何感想。
有同學會問，這有問題嗎？沒問題。只是不怎麼好看而且有些難以維護。
那麼我們來看看有沒有更好的方式吧。
本文所以的**都在這個鏈結。 github.com/link-x/veri…
首先**未動，文件先行我們先來看下這一坨東西
// 變數
var obj = ,
date: '2018-10-10 08:08'
} // 校驗規則
var rule = [
number: [
],string: [
],array: [,],
object: [
],date: [
]] // 自定義校驗規則
function
judgeobj (val, cb) esle
}複製**
總之就是配置校驗，減少if else。拯救髮際線。
那麼激動人心的時候到了。開始搬磚寫**
檔案中。為了讓**看著更簡單，我們就當所有的人都不會使用出錯，所以不會對傳入的引數進行校驗是否錯誤，有興趣的同學可以自己提交
首先，定義乙個class
class
verify
// 每次例項化的時候 把需要校驗的規則和變數匯入
this.$init(data, rules)
}$init (data, rules)
iterator (rules)
// 迴圈迭代
for (let v of
object.keys(rules))
console.log(judge) // 此時我們就能獲取到所有的規則啦
console.log(this.data[v]) // 所有的資料}}
}複製**
孩兒們，躁動起來
我們重點寫一下這個 iterator 函式，這個寫好了，就完成了一半
// 我們抽出兩個函式來執行，自定義規則校驗吧，不如iterator太大了
class
verify
// 迴圈迭代
for (let v of
object.keys(rules))
const val = this.data[v]
if (tostring.call(judge.validator) === '[object function]')
})(status))
} else
if (judge.required) else
if (!judge.required && judge.min && judge.max)
if (status.status) }}
}複製**
接下來我們新建乙個檔案，就叫utils.js吧，把所以的型別校驗都放在那裡。
// 直接上**，簡單粗暴.這些校驗大家應該都不陌生吧。
export
const isarray = (data) =>
export
const isnumber = (data) =>
export
const isstring = (data) =>
export
const isboolean = (data) =>
export
const isfunc = (data) =>
export
const isobject = (data) =>
export
const isnull = (data) =>
export
const arraylen = (data) =>
export
const objectlen = (data) =>
export
const isdate = (data) =>
export
const verifydate = (val) =>
export
const getlen = (val) =>
export
const getobjlen = (val) =>
export
const getnumlen = (val) =>
export
const gettype = (val) =>
export
const typeofs =
export
const gettypelen =
複製**
import from
'./index.js'
class
verify
this.$init(data, rules)
}$init(data, rules)
verifytop (obj, val)
verifybottom (obj, val)
iterator (rules)
let status =
for (let v of
object.keys(rules))
const val = this.data[v]
if (isfunc(judge.validator))
})(status))
} else
if (judge.required) else
if (!judge.required && judge.min && judge.max)
if (status.status)
}return status
}validate (cb) )
}}複製**
"./utils.js">script>
"./index.js">script>
var obj = ,
date: '2018-10-10 08:08'
} var rule = [
number: [
],string: [
],array: [,],
object: [
],date: [
]]var judgeobj (val, cb) esle
}var main = new verify(obj, rule);
main.validate((e) =>
alert('err')
console.log(e.key + 'err' + e.message)
})main.$init(data, rule)
複製**
JavaScript常用表單驗證
目錄 1 js 字串長度限制 判斷字元長度 js限制輸入 限制不能輸入 textarea 長度限制 2.js判斷漢字 判斷是否漢字 只能輸入漢字 3 js判斷是否輸入英文 只能輸入英文 4 js只能輸入數字,判斷數字 驗證數字 檢測數字 判斷是否為數字 只能輸入數字 5 只能輸入英文本元和數字 6 ...
JavaScript常用表單驗證
目錄 1 js 字串長度限制 判斷字元長度 js限制輸入 限制不能輸入 textarea 長度限制 2.js判斷漢字 判斷是否漢字 只能輸入漢字 3 js判斷是否輸入英文 只能輸入英文 4 js只能輸入數字,判斷數字 驗證數字 檢測數字 判斷是否為數字 只能輸入數字 5 只能輸入英文本元和數字 6 ...
八 JavaScript 表單驗證
body script 表單驗證 functionvalidateform e mail驗證 輸入的資料必須包含 符號和點號 同時，不可以是郵件位址的首字元，並且 之後需有至少乙個點號 functionvalidateemailform script formname myform action d...