輸入框中限制通常有三種處理方法
第一種：設定type屬性（不推薦）
設定type屬性為number，text等等，此方法輸入框的后面會有不必要樣式出現
<el-input type="number"></el-input>
第二種：在屬性中添加onkeyup或者oninput進行正則判斷
onkeyup，oninput，onchange各有好壞，在這里，推薦onkeyup，在要求不是太高的系統中可以這樣使用
<el-input v-model="form" onkeyup="value=https://www.cnblogs.com/dalingxuan/p/value.replace(/[^/d]/g,0)"> </el-input>
第三種：通過監聽事件監聽，對于一些特殊要求的輸入框可以采用此方法
當輸入完畢后檢查整段輸入值的規則是否符合，如果不符合就設定為空，
因為不知道用戶中途會不會輸入英文字母，漢字，特殊字符等等不規則字符，
采用第二種方法就會難以判斷字符的格式，最后用戶確認時說不定會報錯，
以手機號碼為例（其他格式都一樣，都只是換一下正則運算式罷了）
<el-input v-model="form.telephone" placeholder="請輸入11位手機號" @change="confirmTelephone"> </el-input>
methods中
confirmTelephone() { if (!/^1[0-9]{10}$/.test(this.form.telephone)) this.form.telephone = ''; },
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/245121.html
標籤：JavaScript
下一篇：繪制微信小程式驗證碼